ui-select2里面的指令没有更新控制器模型

我有一个指令，需要一个集合并构建一个下拉列表。ui-select2里面的指令没有更新控制器模型

.directive("lookupdropdown", function() { 
    return { 
     restrict: 'E', 
     scope: { 
      collectionset: '=', 
      collectionchoice: '=' 
     }, 
     replace: true, 
     template: '<select class="input-large" ui-select2 ng-model="collectionchoice" data-placeholder="">' + 
        ' <option ng-repeat="collection in repeatedCollection" value="{{collection.id}}">{{collection.description}}</option>' + 
        '</select>', 
     controller: ["$scope", function ($scope) { 
      $scope.repeatedCollection = new Array(); //declare our ng-repeat for the template 
      $scope.$watch('collectionset', function() { 
       if ($scope.collectionset.length > 0) { 
        angular.forEach($scope.collectionset, function (value, key) { //need to 'copy' these objects to our repeated collection array so we can template it out 
         $scope.repeatedCollection.push({ id: value[Object.keys(value)[0]], description: value[Object.keys(value)[1]] }); 
        }); 
       } 
      }); 

      $scope.$watch('collectionchoice', function (newValue, oldValue) { 
       debugger; 
       $scope.collectionchoice; 
      }); 
     } ] 
    } 
});

这工作正常。它构建出下降没有问题。当我改变下拉值时，第二个监视函数被调用，我可以看到它将集合选择的值设置为我想要的值。但是，我已经将这些收集选项放入指令中并不会影响新的选择。

<lookupDropdown collectionset="SecurityLevels" collectionchoice="AddedSecurityLevel"></lookupDropdown>

这是HTML标记。

这是JavaScript：

$scope.SecurityLevels = new Array(); 
$scope.GetSecurityLevelData = function() { 
    genericResource.setupResource('/SecurityLevel/:action/:id', { action: "@action", id: "@id" }); 
    genericResource.getResourecsList({ action: "GetAllSecurityLevels" }).then(function (data) { 
     $scope.AddedSecurityLevel = data[0].SCRTY_LVL_CD; 
     $scope.SecurityLevels = data; 
     //have to get security levels first, then we can manipulate the rest of the page 
     genericResource.setupResource('/UserRole/:action/:id', { action: "@action", id: "@id" }); 
     $scope.GetUserRoles(1, ""); 
    }); 
} 
$scope.GetSecurityLevelData();

然后，当我去后我的新用户角色，我这样设置用户角色字段：

NewUserRole.SCRTY_LVL_CD = $scope.AddedSecurityLevel;

，但是这仍然是第一尽管我已更新下拉菜单，但根据手表功能，它已更改为正确的值。我在这里错过了什么？

来源

2013-09-10 yaegerbomb

这里的问题是我的指令被转化为另一个指令。使范围即时传递到它所在的指令的子节点中。所以像$ parent - > $ child - > $ child这样的东西。这当然是对第三层和第二层进行了修改。但第一层不知道发生了什么。这固定它：

<lookupDropdown collectionset="SecurityLevels" collectionchoice="$parent.AddedSecurityLevel"></lookupDropdown>

来源

2013-09-10 20:56:40 yaegerbomb

你面临这个问题，因为在Javascript中的原型自然继承。让我试着解释一下。一切都是Javascript中的一个对象，一旦你创建了一个对象，它就继承了所有的Object.Prototype，这最终导致了最终的对象，即对象。这就是为什么我们能够.toString（）在JavaScript（甚至函数）中的每个对象，因为它们都从Object继承。

指令上的这个特殊问题是由于误解了Angular JS中的$范围而产生的。 $范围不是模型，但它是模型的容器。请参阅下文，了解在$范围内定义模型的正确和不正确的方式：

... 
$scope.Username = "[email protected]"; //Incorrect approach 
$scope.Password = "thisisapassword";//Incorrect approach 
... 
$scope.Credentials = { 
    Username: "[email protected]", //Correct approach 
    Password: "thisisapassword" //Correct approach 
} 
...

这两个声明有很大的不同。当您的指令更新其范围（指令的独立范围）时，它实际上会将引用完全覆盖掉新值，而不是更新对父范围的实际引用，因此它将指令范围和控制器断开。

你的方法如下：

<lookupDropdown collectionset="SecurityLevels" collectionchoice="$parent.AddedSecurityLevel"></lookupDropdown>

这种方法的问题是，虽然它的工作原理，但它并非是推荐的解决方案，这是为什么。如果您的指令放置在另一条指令中，而您的指令范围与实际控制器之间有另一个隔离范围，那么您必须执行$parent.$parent.AddedSecurityLevel并且这可能会一直持续下去。因此不是推荐的解决方案。

结论：

始终确保有限定示波器上的模型和对象每当你利用分离作用域或使用纳克指示其中利用分离范围即ng-model只是看看是否有点（。）的地方，如果它丢失了，你可能会做错事。

来源

2014-05-25 18:56:10

ui-select2里面的指令没有更新控制器模型

回答

相关问题