使用理解表達式的自定義指令

我花了很多時間在Python中，所以我非常喜歡Angular的ngOptions中的comprehension_expression語法。使用理解表達式的自定義指令

但我想在其他輸入中使用此語法，如使用ng-list。例如，我有slug對象的不平凡的列表：

$scope.slugs = [ 
    {id: 1, name: 'angular-directives'}, 
    {id: 23, name: 'composing-your-very-own-angular-directives'}, 
    {id: 70, name: 'directives-in-angular-js'}, 
];

而且我想用一個單一的輸入編輯名稱，創建普通的對象只有一個名稱屬性的新蛞蝓。但是，<input ng-list ng-model="slug.name for slug in slugs">不起作用。

由於開箱即用的語法不起作用（我不會真的期望它），我如何在自定義指令的範圍中使用comprehension_expression語法？

來源

2014-03-19 chbrown

NgModel指令將元素綁定到作用域上的屬性，它不支持理解表達式。如果想通過使用「ng-list」在輸入字段中編輯名稱，則需要創建一個包含slugs中所有名稱值的數組。

然後創建一個「newSlugs」數組來收集具有新名稱的對象。一旦對象更新後刷新名稱，向每個子彈註冊一個$ watch觀察器。

$scope.slugs=[{id:1,name:'angular-directives'},{id:23,name:'composing-your-very-own-angular-directives'},{id:70, name:'directives-in-angular-js'}]; 
$scope.names=[]; //for ng-list 
$scope.newSlugs = []; 

//loop through every element in array slugs 
$scope.slugs.forEach(function(ele,index,array){ 
    //for ng-list 
    $scope.names.push(ele.name); 
    //create a new obj with one attribute 'name' 
    $scope.newSlugs.push({name:ele.name}); 
    //register observer to every slug, update the name of obj in newSlugs once user had updated the name 
    $scope.$watch("names["+index+"]",function(newValue,oldValue){ 
     $scope.slugs[index].name=newValue; 
     $scope.newSlugs[index].name=newValue; 
    }); 
});

順便說一句，這是一個「更新」的功能......我想也許你需要防止用戶通過插入分離器角色作成一個新的名字。

這裏是jsfiddle demo。

希望這對你有幫助。

來源

2014-03-19 09:05:21 Chickenrice

我意識到我對'ng-model'的樂觀濫用並不適合如何使用ng-model'，但我打算在其他屬性中使用理解表達式，目的是爲了鏈接範圍。在你的例子中，我看不到你用'newSlugs'得到了什麼 - 什麼時候會和'slugs'有什麼不同？另外，我確實想創建新的slu，，而不是隻更新現有的slu slu，根據它是否具有'{id：？，...}'屬性來動態同步。 – chbrown

使用理解表達式的自定義指令

回答

相關問題