2016-11-27 16 views
0

ng-optionsでselect要素を使用したくないAngularのプロジェクトを持っていますので、別のオプションを順に並べてリストを作成しましたそのうちの1つを選択します。AngularJS - ng-repeatの反復の1つでスコープを変更する

<div class="countrylist"> 
    <ul> 
    <li ng-repeat="c in shippingCountry"><p>{{c.name}}</p></li> 
    </ul> 
</div> 

したがって、選択したオプションは、選択したオプションが表示される別の要素を変更します。

これを実行するには、最初の要素の選択したオプションから2番目の要素にデータを渡す必要があります。私はこのようなことをしようとしました

<li ng-repeat="c in shippingCountry" ng-click="selectedCountry = {{c}}"><p>{{c.name}}</p></li> 

成功しません。

あなたはそれはとても明示的に親スコープを参照し、各反復の子スコープを作成し、事前

答えて

1

このような機能を01のように使用することをお勧めしますお使いのコントローラ

$scope.Click=function (c) 
{ 
    $scope.select=c; 

} 
+0

これは正しい角度をAngularで行い、投稿されました。 Antonioが投稿した前に答えをありがとう! – Joe82

+0

あなたはそれがより正しいと思いますか? (私は$親と一緒に働くことはちょっと難しいかもしれないと知っていますが、あなたがそれを行うより良い方法だと感じたら、私はSajeendranの – Joe82

1

plunker here感謝を確認することができます。このような

変更、

<ul> 
<li ng-repeat="c in shippingCountry" ng-click="$parent.selectedCountry = c"><p>{{c.name}}</p></li> 
</ul> 

DEMO

0
// .html 
<div> 
    <ul> 
    <li>{{selectedCountry.item}}</li> 
    </ul> 
</div> 
<div class="countrylist"> 
    <ul> 
    <li ng-repeat="c in shippingCountry" ng-click="selectedCountry.item = c"><p>{{c.name}}</p></li> 
    </ul> 
</div> 

// controller 
$scope.selectedCountry = { 
    item: $scope.shippingCountry[0] 
}; 

Example

1

でこのメソッドを持つ

<li ng-repeat="c in shippingCountry" ng-click="Click(c)"><p>{{c.name}}</p></li> 

私はあなたのplunker hereを修正しました。これは、現在のスコープで、子ではなく現在のスコープで動作するため、スコープ内のメソッドを使用する方が良いでしょう。

<li ng-repeat="c in shippingCountry" ng-click="selectCountry(c)"> 
    <p>{{c.name}}</p> 
</li> 
関連する問題