2013-06-13 4 views
7

私はfuelUX WizardとAngularjsを使用しています。私は、このコントローラのメソッドに次のボタンが有効になっているのが好きまたは無効基点になります。angularjsでng-disabledのチェックを実行するにはどうすればよいですか?

$scope.canMoveForward = function(){ 
     switch($("#moduleWizard").wizard("selectedItem").step){ 
      case 1: 
      //check if the module on the first step is valid*/ 
       return $scope.validSelection && $scope.linkedPredicateForm.$valid; 

      case 2: 
      //check if the table is empty 
       return !linkingDataSource.isEmpty(); 

      case 3: 
       var enab= ($scope.saveModeForm.$valid && $scope.newSourceForm.$valid) || 
       ($scope.saveModeForm.$valid && $scope.appendSourceForm.$valid) 
     } 
    }; 

だから、確かにこれは私がボタンをdecleared方法です:

<div class="actions"> 
       <button class="btn btn-mini btn-prev" ng-click="refresh()"> <i class="icon-arrow-left"></i>Prev</button> 
       <button class="btn btn-mini btn-next" data-last="Finish" id="wizard-next" ng-disabled="!canMoveForward()" 
         ng-click="handleStepResult()"> 
        Next<i class="icon-arrow-right"></i></button> 
      </div> 

そして、それは私が取得する場合を除き、正常に動作します2番目のページから最初のページに戻る:2番目のページで次のボタンが無効になっている場合は、フォームを編集しない限り、最初のページでもこのようになります。とにかくng-disabledバインディングをリフレッシュする方法はありますか?

答えて

13

canMoveForward()の出力が変更されているかどうかはAngularJSが確認できません。私は、このようなことのためにスコープ変数に依存する方が簡単だと分かりました。私は同じ問題があったと私は問題があることを発見しました

$scope.canMoveForward = false; 
+0

非常に変数をtrue.Settingことsmoothly.Justは、変数に関数を呼び出し、その関数からtrueまたはfalseを返す動作します+。 1そのための – jayadevkv

2

ng-disabled="!canMoveForward" 

は、その後、あなたのコントローラにだけ必要に応じて真/プロパティをfalseに設定します。あなたはこのような何かを行うことができます!演算子を使用しています。

これは失敗します。

ng-disabled="!canMoveForward()" 

しかし、これは動作しますが:

ng-disabled="canNotMoveForward()" 
+0

これはスタンドアロンの関数では動作しますが、メソッドでは動作しません。 – savenkov

+0

ウィザードを適切なCSSスタイルでレンダリングすることができません。 AngularJSも使用しています。 適切なcssファイルとjsファイルの読み込みを手伝ってもらえますか?また、ウィザードをレンダリングする方法も?ありがとう。 –

関連する問題