Question

这是我的情景，

视图：

<div data-ng-controller="MyModuleController">
   <div ng-repeat="a in range() track by $index" >
      <ty-project idx="$index+1" ng-model="projects[$index]" ></ty-project>
   </div>
</div>

控制器：

$scope.projects= [];

$scope.range = function() {
    // return some random number - it does not really matter for the purpose
};

ty-project只是一个指令

angular.module('mymodule').directive('tyProject', [
     function() {
         return {
            templateUrl: 'modules/mymodule/directives/typrojectTemplate.html',
             restrict: 'E',
             scope: {
                   idx: '='
             },
             link: function postLink(scope, element, attrs) {
             }
       };
    }
]);

typrojectTemplate是一个带有2个输入的简单模板，如下所示：

  <div>
      <label>Project_{{idx}} name</label>
      <input type="text" name="project.name" ng-model="project.name"/>
  </div>
  <div >
     <label >Project_{{idx}} total </label>
     <input type="number" name="project.total" ng-model="project.total" />
 </div>

这是我的控制器

angular.module('mymodule').controller('MyModuleController', ['$scope', 
    function($scope) {

       $scope.projects: [] ;

        $scope.save = function() {

            console.log(projects);
        };

        $scope.range = function() {
            var n= 2;// todo: return random number..
            return new Array(n);
        };
    }
]);

所以在范围方法返回2 将有2个项目对象每个项目都有名称和总属性。

如何将项目绑定到控制器？

感谢。

Answer 1

hay你必须将范围从控制器传递给指令。该指令将此范围传递给模板。

你可以在你的指令中做到这一点：

scope:{
       project: '=ngModel'//will pass it to the Template.
       idx: '=' //
}

我不知道，你是否将控制器分配给视图。

Angularjs - 带有动态大小的数组的ng-model

1 个答案: