Javascript 带replace true的Angularjs指令需要返回值

在这种情况下，我需要使用angularjs修改表单，将单个文本字段转换为下拉列表和另一个文本字段。页面后面的代码将查找原始文本字段，因此我需要将数据反馈回原始文本字段

改变原来的形式将是困难的。我摸不到它背后的密码。就后端而言，这需要是相同的形式

我试图通过将以下angularjs指令附加到原始文本字段来实现这一点。就目前看来，一切似乎都很顺利。。。直到我提交表格。提交表单后，原始文本字段再次变为空

如何正确地将数据返回到要替换的原始字段

function debug(x){ try { console.log(x); } catch (x) {} }

angular.module('app',['ngCookies','ngResource','ui'])
.directive('opsDirectChoice', function(){
    return {
        'restrict'    :    'A',
        'require'     :    'ngModel',
        'scope'       :    true,
        'template'    :    '<span>' + 
                            '<select style="font-size:11px" ng-model="choose_phoneLoc">' + 
                                '<option value="NY">New York</option>' + 
                                '<option value="SF">San Francisco</option>' + 
                            '</select>' + 
                            '<input type="text" ng-model="number_phoneLoc" value="">' +
                            '</span>',
        'replace'    :    true,
        'link'        :    function($scope, elem, attrs, ctrl){    
            phoneFilter = function(phoneIn){
                var phoneOut = phoneIn.replace(/[^0-9]+/g, '');

                if( phoneOut.length > 7 ){
                    phoneOut = phoneOut.substring(0,3) + '-' + phoneOut.substring(3,6) + '-' + phoneOut.substring(6,10);
                }else if( phoneOut.length > 3 ){
                    phoneOut = phoneOut.substring(0,3) + '-' + phoneOut.substring(3,7);
                }

                return phoneOut;
            };

            /*
            $scope.$watch(attrs.ngModel, function (newValue, oldValue) {
                debug(' ng Model is changed: ' + oldValue + ' => ' + newValue);
                if( newValue != oldValue ){
                    if( newValue.substring(0, 1) == 'D' ){
                        $scope.choose_phoneLoc = 'D';
                    }else{
                        $scope.choose_phoneLoc = 'OPS';
                    }

                    debug('ngmodel:  setting number_phoneLoc to phoneFilter(newValue): ' + phoneFilter(newValue));

                    $scope.number_phoneLoc = phoneFilter(newValue);
                }
            });
            */

            $scope.$watch('choose_phoneLoc', function(newValue, oldValue){
                if( newValue != oldValue ){
                    if( newValue ){
                        setViewValue();
                    }
                }
            });

            $scope.$watch('number_phoneLoc', function(newValue, oldValue){
                if( newValue != oldValue ){
                    $scope.number_phoneLoc = $scope.choose_phoneLoc + '\t' + phoneFilter(newValue);

                    setViewValue();
                }
            });

            function setViewValue(){
                var temp = phoneFilter($scope.number_phoneLoc);

                debug('Setting OPS to: ' + $scope.choose_phoneLoc + ' ' + temp);

                //  attrs.ngModel = $scope.choose_phoneLoc + '\t' + temp;
                ctrl.$setViewValue($scope.choose_phoneLoc + '\t' + temp );
                // ctrl.$render();
            }

            $scope.choose_phoneLoc = 'NY';
            $scope.number_phoneLoc = phoneFilter(attrs.ngModel);

        }
    };
})

函数调试（x）{try{console.log（x）；}catch（x）{}
angular.module（'app'，['ngCookies'，'ngResource'，'ui']））
.directive（'opsDirectChoice'，function（）{
返回{
“限制”：“A”，
'require'：'ngModel'，
“范围”：true，
“模板”：“模板”
'' + 
“纽约”+
“旧金山”+
'' + 
'' +
'',
“替换”：true，
“链接”：函数（$scope，elem，attrs，ctrl）{
phoneFilter=函数（phoneIn）{
var phoneOut=phoneIn.replace（/[^0-9]+/g'）；
如果（phoneOut.length>7）{
phoneOut=phoneOut.substring（0,3）+'-'+phoneOut.substring（3,6）+'-'+phoneOut.substring（6,10）；
}否则如果（phoneOut.length>3）{
phoneOut=phoneOut.substring（0,3）+'-'+phoneOut.substring（3,7）；
}
返回电话输出；
};
/*
$scope.$watch（attrs.ngModel，function（newValue，oldValue）{
调试（'ng模型已更改：'+oldValue+'=>'+newValue）；
如果（新值！=旧值）{
if（newValue.substring（0，1）='D'）{
$scope.choose_phoneLoc='D'；
}否则{
$scope.choose_phoneLoc='OPS'；
}
调试（'ngmodel:将number_phoneLoc设置为phoneFilter（newValue）：'+phoneFilter（newValue））；
$scope.number\u phoneLoc=phoneFilter（newValue）；
}
});
*/
$scope.$watch（'choose_phoneLoc'，函数（newValue，oldValue）{
如果（新值！=旧值）{
如果（新值）{
setViewValue（）；
}
}
});
$scope.$watch（'number\u phoneLoc'，函数（newValue，oldValue）{
如果（新值！=旧值）{
$scope.number_phoneLoc=$scope.choose_phoneLoc+'\t'+phoneFilter（newValue）；
setViewValue（）；
}
});
函数setViewValue（）{
var temp=phoneFilter（$scope.number\u phoneLoc）；
调试（'将OPS设置为：'+$scope.choose_phoneLoc+''+temp）；
//attrs.ngModel=$scope.choose_phoneLoc+'\t'+temp；
ctrl.$setViewValue（$scope.choose_phoneLoc+'\t'+temp）；
//ctrl.$render（）；
}
$scope.choose_phoneLoc='NY'；
$scope.number_phoneLoc=电话过滤器（attrs.ngModel）；
}
};
})

为什么不使用ng switch或ng show/hide，然后使用pages controller评估需要显示的内容-这比尝试用DOM替换然后反转替换要省力得多-这就是切换和show/hide的功能for@Mark-Sullivan如果你能告诉我如何在没有直接访问原始表单我当然很感激。你是说你没有访问原始html文件的权限吗？我的问题是，你是如何在页面上获得指令的？@Mark Sullivan通过一个自定义字段，允许向页面添加额外的javascript，在document ready上，我正在添加所有angular js代码，然后引导它。你能发布你试图修改的html表单吗？