Question

我使用angular 1.3.15版本和我自己的指令来创建表单元素。当我在chrome和firefox上运行时，模型值会更新，但ie10表单值不会在模型上更新。

相同的代码适用于较早版本的Angular。我尝试使用1.2.1，它按预期工作。

Angular 1.3.15此处代码的版本http://goo.gl/Qzk5iA

var myAppModule = angular.module('myApp', []);   
 myAppModule.controller("TodoCtrl",function($scope) {    
        $scope.tree = [];
        $scope.nodeMap = [];
        $scope.items = [{name:"Sudha",group:"",visibility:"visible",value:{value:"as"}},{name:"Gautam",group:"",visibility:"visible",value:{value:"as"}}];
        $scope.foo = function()
        {
            for(var i=0;i<$scope.items.length;i++)
            {
                var item = $scope.items[i];
                console.log(item.name+" "+item.value.value);
            }
        }
    }).directive("ppField",["$compile", function($compile) {
         return {
            replace:true,
            require:'ngModel',
            scope:{
                parameter :'=parameter',        
                ngModel : '='
            },
            restrict: 'AE',
            link : function($scope, $element, $attrs) {   

                var field = '<input   id=\''+$scope.parameter.name+'\'  name=\''+$scope.parameter.name+'\'  type="text" ng-model="parameter.value.value" class="form-control input-sm">';
                var newInput = angular.element(field);            
                var $e =$compile(newInput)($scope);
                $element.append($e);
            }
         };
    }]);

html是一个带有指令的简单ng-repeat。单击完成按钮后，模型值将打印到控制台。 Chrome按预期工作，但IE显示初始值。

<!DOCTYPE html>
<html>

  <head>
    <link rel="stylesheet" href="style.css">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.15/angular.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
    <script src="script.js"></script>
  </head>

  <body>
    <div ng-app="myApp">   
      <div ng-controller="TodoCtrl">
          <button ng-click="foo()">Done</button>
            <div data-drag-enabled="false">
                    <div ng-repeat="parameter in items">      
                      <label for="{{parameter.name}}" class="col-sm-4 control-label labelBreak" data-ng-click="showTooltip(node)">                    
                        {{parameter.name}}
                      </label>
                      <div class="col-sm-8 fieldDiv" ng-model="fieldCount">
                          <pp-field ng-model="parameter.value" parameter="parameter" disabled="disabled"></pp-field>
                      </div>
                    </div>

            </div>

      </div>
    </div>
  </body>

</html>

Answer 1

删除已禁用=＆＃34;已禁用＆＃34;如果父禁用，IE将禁用所有子元素，这可能是绑定不起作用的原因。 Chrome不会像IE一样禁用。

试试这个

Angularjs 1.3.15 ng-model指令不绑定IE但适用于Chrome

1 个答案: