1

angularjs 1.2.0-rc.1、rc.2、およびrc.3で機能する角度コードがいくつかあります。しかし、1.2.0 と 1.2.1 では機能しません。

http://plnkr.co/edit/KBYFJQ2sZeOJ79Hid1gGで問題を説明しました

私のHTMLは

<!DOCTYPE html>
<html ng-app="app">
<head>
    <script data-require="angular.js@1.2.1" data-semver="1.2.1"
            src="http://code.angularjs.org/1.2.1/angular.js"></script>
    <link rel="stylesheet" href="style.css"/>
    <script src="script.js"></script>
</head>
<body ng-controller="AppCtrl">
<ul>
    <li ng-repeat="menuEntry in menuItems">
        <a ng-href="#" ng-click="{{menuEntry.action}}">{{menuEntry.text}}</a>
    </li>
</ul>
</body>

</html>

そして私の角度コードは

'use strict';

angular.module('app', [])
    .controller('AppCtrl', function ($scope) {
        var menuItems = [
            {
                text: "Log off",
                action: 'logoff()'
            }
        ];

        var logoff = function () {
            alert("logoff called")
        };
        $scope.menuItems = menuItems;
        $scope.logoff = logoff;
    });

このコードを 1.2.0-rc.3 で実行すると、エラーなしで実行され、リンクをクリックするとアラート ボックスが表示されます。しかし、1.2.0 または 1.2.1 で実行すると、エラーが発生します。

 Error: [$parse:syntax] Syntax Error: Token 'menuEntry.action' is unexpected, expecting [:] at column 3 of the expression [{{menuEntry.action}}] starting at [menuEntry.action}}].

誰でもこの問題で私を助けることができますか?

4

1 に答える 1

2

のドキュメントはngClick、呼び出し可能な式に {{..}} バインディングを使用できることを示していません。古いバージョンでは偶然に機能するだけかもしれませんが、新しいバージョンでの実装の変更により機能しなくなりました。

とにかく、これはコードを接続する奇妙な方法のようです。action 属性を実際の関数に置き換えて呼び出すことはできますか? 例えば

angular.module('app', [])
    .controller('AppCtrl', function ($scope) {
        $scope.logoff = function () {
            alert("logoff called")
        };

        $scope.menuItems = [
            {
                text: "Log off",
                action: $scope.logoff
            }
        ];
    });

それで

<a ng-href="#" ng-click="menuEntry.action()">{{menuEntry.text}}</a>

動的な式で開始する必要がある場合は、 で呼び出すことができます$scope.eval。例えば

var menuItems = [
    {
        text: "Log off",
        action: 'logoff()'
    }
];

angular.forEach(menuItems, function(menuItem) {
    menuItem.callableAction = function() { return $scope.$eval(menuItem.action); }
});

それから

<a ng-href="#" ng-click="menuEntry.callableAction()">{{menuEntry.text}}</a>
于 2013-11-24T16:03:59.563 に答える