

angularJSについて質問です。  
ng-
repeartを使って、表示されたリストの中から項目をクリックすると背景色が変わるプログラムを作成したいと思っています。今回はangularJSのデータバインド機能を使って次のプログラムを実行させたいのですが上手くいきません。ng-
repeartでループさせているlistには複数のキーと値が格納されています。今回は、そのキーの１つとしてstyleというキーにCSSを持たせて受け渡しを行いたいと考えています。

HTMLファイル側

[code]

    <div ng-repeart="item in list" ng-click="change(item)" ng-style="{{item.style}}" >
      <P>表示する項目名</p>
    </div>
    
[/code]

JSファイル側

[code]

    $scope.change = function(check){
      if(check.style==null){
        check.style = "{backgroundColor: 'red' }";
      }else{
        check.style = "{backgroundColor: 'blue' }";
      }
    }
    
[/code]

現状では、データバインディングされて、コードは変更されるのですが見え方は変わりません。  
このような場合の対処法を教えてください。


CC BY-SA 3.0
2017-09-27T06:44:38.570
38229
2020-01-15T02:03:35.420
2017-09-27T07:04:58.293
2383
25556
question
angularjs
angularJSのng-clickとng-styleを使った方法

[code]

    $scope.$apply(function(){
      if(check.style==null){
        check.style = "{backgroundColor: 'red' }";
      }else{
        check.style = "{backgroundColor: 'blue' }";
      }
    });
    
[/code]

これで動かないでしょうか？


CC BY-SA 3.0
2017-09-27T07:35:47.050
38230
2017-09-27T07:35:47.050
16768
38229
answer