Question

我创建了以下指令：

app = angular.module('sapp', [])
.config(['$interpolateProvider', function ($interpolateProvider) {
    $interpolateProvider.startSymbol('[[');
    $interpolateProvider.endSymbol(']]');
}]);

app.directive("word", function() {
    return {
        restrict: "E",
        scope: {
            remove : "&",
            word_id : "=",
            keyword : "=",

        },
        template: '<div>[[keyword]] - [[word_id]]' +
            '<i class="icon-remove" ng-click="remove({word_id:word_id})"></i></div>'
    };
});

app.controller("WordListCtrl", function($scope){
    $scope.wordlist = JSON.parse('{{wordlist|safe}}');
    //The above just loads a dictionary as {1 : 'apple', 2: 'boy'}
    $scope.removeWord = function(word_id){
        console.log("Removing", word_id);
    };
});

使用此指令的html代码是：

<word ng-repeat="(word_id, keyword) in wordlist" word_id="word_id" keyword="keyword" remove="removeWord(word_id)"></word>

检查代码：http://jsfiddle.net/YPgBt/10/ 我在这里遵循教程：http://www.egghead.io/video/mZGgNPTHc2Q使用我编写的代码。

即使我对关键字和word_id给予完全相同的处理。当我执行“[[keyword]] - [[word_id]]”时，word_id永远不会打印在模板中，word_id始终为空白。

我正在遍历字典而不是普通列表。当我单击icon-remove元素时，控制台会打印“删除未定义”。在做了随机的事情之后，我看到了一个非常奇怪的行为，如果我更改了我的指令中的ng-click，那么任何键或值都是关键字..那就是...... ng-click =“remove（{word_id：关键字}）“或ng-click =”remove（{keyword：word_id}）“或ng-click =”remove（{keyword：whatever}）“..它为我提供了所需的输出，这意味着控制台打印”删除1 “

我在这里做错了什么？我是AngularJS的新手，请原谅我是否犯了一个天真的错误。

Answer 1

在指令的模板中，您只需将word_id传递给函数remove()，

<i class="icon-remove" ng-click="remove(word_id)"></i>

在控制器中，您可以使用delete关键字

删除该条目

$scope.removeWord = function (word_id) {
    delete $scope.wordlist[word_id];
    console.log("Removing", word_id);
};

的 Demo

奇怪的AngularJS问题：使用字典循环指令

1 个答案: