ng-clickを使用してブール値変数の値を変更する

私はAngularJSを初めて使い、チームがプレイする日に応じて特定のゲームをフィルタリングするWebアプリケーションを作成しています。私はng-clickでブール変数の値を変更しようとしていますが、意図したとおりに動作していないようです。ng-clickを使用してブール値変数の値を変更する

ここでは私のHTML私はときに、ユーザーには表示に非表示になりますので、TNFの値を変更したい

<body ng-controller="MatchupController as matchupCtrl"> 
    <div class="jumbotron" ng-controller="DayController as DayCtrl"> 

    <button type="button" class="btn btn-info" ng-click="tnf()">Thursday Games</button> 

</div> 

<div class="row" ng-repeat="team in matchupCtrl.teams" ng-hide="team.tnf"> 
    <div class="col-sm-5 well"> 
     <h3>Home</h3> 
     {{team.home.name}} 
    </div> 
    <div class="col-sm-5 well" > 
     <h3>Away</h3> 
     {{team.away.name}} 
    </div> 

</div>

...と私のJS

var app = angular.module('mainApp', []); 
app.controller('MatchupController',function(){ 
    this.teams = matchUps; 

}); 


var matchUps = [ 
{ 
    home:{ 
     name:'Cincinnati Bengals', 
     homeImage:{'background-image': 'url(http://prod.static.bengals.clubs.nfl.com/assets/img/gbl-hd-bg.jpg)'}, 
    }, 
    away:{ 
     name:'Miami Dolphins', 
    awayImage:{'background-image': 'url(http://blog-imgs-70.fc2.com/o/f/f/offseason2012/Dolphins.jpg)'}, 
}, 
    location: 'Paul Brown Stadium, Cincinnati', 
    time: '8:25pm', 
    date: "2016-09-29", 
    tnf: false, 
}, 
{ 
    home:{ 
     name:'Jaxonville Jaguars', 
     homeImage:{'background-image':  'url(http://nfasl.spruz.com/gfile/75r4!-!JEHJEG!-!zrzor45!-!LJPKNQQG-JJSJ- HHMR-NNJR-EPLFJOMGLIMD/jacksonville_jaguars_banner.jpg)'}, 
    }, 
    away:{ 
     name:'Indianapolis Colts', 
     awayImage: {'background-image': 'url(http://www.851facebook.com/images/sports-nfl-afc-south-indianapolis_colts-night-football-rugby-facebook-timeline-cover-banner-for-fb-profile.jpg)'}, 
    }, 
    location: 'Wembley Stadium, London', 
    time: '9:30am', 
    date: "2016-10-02", 
    snf: false, 
      }, 
{ 
    home: { 
     name:'Minnesota Vikings', 
     homeImage: {'background-image': 'url(http://611enterprises.com/wp-content/uploads/2014/11/Minnesota_Vikings_banner.jpg)'}, 
    }, 
    away: { 
     name: 'New York Giants', 
     awayImage: {'background-image': 'url(http://www.covermyfb.com/media/covers/thumb/3895-new-york-giants.jpg)'}, 
    }, 
    location: 'U.S. Bank Stadium, Minneapolis', 
    time: '8:30pm', 
    date: "2016-10-03", 
    mnf: false, 
      } 
] 
app.controller('DayController',function() { 
    var tnf = function() { 
     matchUps.tnf = !matchUps.tnf; 
     return matchUps.tnf; 

    } 
});

ボタンをクリックします（つまり、tnfの値をtrueに変更します）。

出典

2016-09-25 Mike Dombrowski

コントローラーの有効範囲にtnf()を添付する必要があります。現在の方法では、単にローカル変数として宣言され、コントローラ関数が終了すると、tnf関数は有効範囲外になり、ガベージコレクションされます。代わりに、これを行う必要があります：

app.controller('DayController',function() { 
    this.tnf = function() { 
     matchUps.tnf = !matchUps.tnf; 
     return matchUps.tnf; 
    } 
});

出典

2016-09-25 03:20:20

ありがとうございました。しかし、変更を加えても、私の機能はまだ機能していません。ここにソースコードへのリンク（メインファイルであるdashboard.htmlとjs/controller.js）があります。 https://github.com/mmikeyd123/DevelopmentExcercise –

何が起こっているのか分かりません。一層小さな問題があるかもしれません。たとえば、経路を定義した場所がわかりません。 –

ng-clickを使用してブール値変数の値を変更する

答えて

関連する問題