agular JS HTMLで

にバインドさ項目と式を組み合わせた：agular JS HTMLで

<ul class="list-group"> 
    <li ng-repeat="item in simpleListVM.datasource track by $index" class="list-group-item"> 
     <simple-list-items listitem="item" listitemid="{{item.data.name + $index + 1}}"></simple-list-items> 
    </li> 
</ul>

を指令では：私は、アプリケーションを実行すると、エラーの下に表示さ

scope: { 
    listitem: '=',    
    listitemid:'&'     
}

。あなたが提供listitemidが補間された表現であるとlistitemid: '&'で定義された関数である必要があるためである

Syntax Error: Token '{' invalid key at column 2 of the expression [{{item.data.name +$index + 1}}] starting at [{item.data.name +$index + 1}}].

出典

2017-02-15 user2323308

は、ラインエラーポイントということです、私のコード例を確認してください？しかし、それはエラーの配列を持っていますが、質問にはありませんか？ – Sravan

あなたが直面している問題を簡単に理解するのに役立つデモを作成してください。 – Manish

はいsimpleListVM.datasourceは配列 – user2323308

。

私にはlistitemid: '&'をlistitemid: '@'に変更したいようです。これは、式の結果にバインドされます。スティーブン・J・バーカーが正しい

出典

2017-02-15 04:58:56

ありがとうございました – user2323308

@ user2323308問題はありません。助けてよかった –

、

<!DOCTYPE html> 
 
<html ng-app="plunker"> 
 

 
<head> 
 
    <script data-require="[email protected]" src="https://code.angularjs.org/1.4.12/angular.js" data-semver="1.4.9"></script> 
 
</head> 
 

 
<body ng-controller="MainCtrl"> 
 
    <ul class="list-group"> 
 
    <li ng-repeat="item in simpleListVM.datasource track by $index" class="list-group-item"> 
 
     <simple-list-items listitem="item" listitemid="{{item.name + $index + 1}}"></simple-list-items> 
 
    </li> 
 
    </ul> 
 
</body> 
 
<script> 
 
    var app = angular.module('plunker', []); 
 

 
    app.controller('MainCtrl', function($scope) { 
 

 
    $scope.simpleListVM = {}; 
 
    $scope.simpleListVM.datasource = [{ 
 
     'name': 'test1' 
 
    }, { 
 
     'name': 'test2' 
 
    }, { 
 
     'name': 'test1' 
 
    }]; 
 

 
    }).directive("simpleListItems", function() { 
 
    var dir = {}; 
 
    dir.scope = { 
 
     listitem: '=', 
 
     listitemid: '@' 
 
    }; 
 
    dir.link = function(s, e, a) { 
 
     console.log("listitem", s.listitem); 
 
     console.log("listitemid", s.listitemid); 
 
    } 
 
    return dir; 
 
    }); 
 
</script> 
 

 
</html>

出典

2017-02-15 05:09:17

ありがとう – user2323308

agular JS HTMLで

答えて

関連する問題