錯誤：[$ compile：ctreq]無法找到指令'ngShow'所需的控制器'ngModel'

您好我是angularjs的新手，並試圖在提交按鈕的onclick過程中調用一個函數。

我的HTML頁面：

<div class="form-group"> 
        <a href="#" ng-click="showGraph = !showGraph" class="btn btn-primary btn-lg" ng-disabled="!model.selectedRole">SUBMIT</a> 
        </div> 
      </form> 
     </div> 
    </div><! end of previous div --> 

<div class="col-sm-6"> <!-- new div --> 
      <div class="panel panel-primary"> 
       <div class="panel-heading" style="background-color:#F8F8FF; text-decoration:none; color:black"><b>Chart</b></div> 
       <div class="panel-body" ng-change="HeadCount()" ng-show="showGraph"> 

      <plot class="barchart" height="300" width="400" yaxis-label-text="'No. of Students'" 
          xaxis-label-text="'standards'" ymin="0" ymax="100" xodomain="ordinals" > 
         <bar-group type="'grouped'" arrangement="'vertical'" style="opacity:100;"> 
          <bars data="available_students" position-function="'/0'" value-function="'/1'" 
            fill="'red'"></bars> 
          <bars data="maximum_students" position-function="'/0'" value-function="'/1'" fill="'blue'" ></bars> 
         </bar-group> 

        </plot> 
       </div> 

      </div> 
      </div> <!-- end of new div -->

這裏我使用ng-click="showGraph = !showGraph"打電話給我showGraph在我的控制器。

我控制器頁

$scope.showGraph = false; 

$scope.HeadCount = function(){ 

      var json_response = { 

         "data": [ 
         { 
          "standard": "Ist", 
          "max_students": 20, 
          "available_students": 8 
         }, 
         { 
          "standard": "IInd", 
          "max_students": 15, 
          "available_students": 10 
         }, 
         { 
          "standard": "IIIrd", 
          "max_students": 50, 
          "available_students": 22 
         } 
         ] 
        } 
    $scope.available_students = [ ['Ist', 8,], ['IInd', 10], ['IIIrd', 22]]; 
    $scope.maximum_students = [['Ist', 15], ['IInd',15], ['IIIrd', 50]]; 
    $scope.ordinals = ['Ist', 'IInd', 'IIIrd']; 
    console.log($scope.ordinals.length); 
    $cookieStore.put('xaxisLength',$scope.ordinals.length); 

    }

我需要通過單擊提交按鈕後，調用來自控制器HeadCount()函數來顯示圖表。

但我得到錯誤，當我點擊提交按鈕表單正在刷新。

Error: [$compile:ctreq] Controller 'ngModel', required by directive 'ngShow', can't be found!

任何人都可以請幫助我，我需要進行更改。

來源

2016-06-21 Kalaiyarasi M

ngChange僅用於不帶div的表單元素。 –

ng-change指令需要ng-model指令。一個NG-模型加入這一行：

<div class="panel-body" ng-change="HeadCount()" ng-show="showGraph">

更多here

來源

2016-06-21 07:09:15

設置$scope.showGraph和圖形渲染上的點擊代碼。

從下面的div中獲取ng-change的搭檔。

<div class="panel-body" ng-show="showGraph">

HTML：add renderGraph to ng-click。

<a href="#" ng-click="renderGraph()" class="btn btn-primary btn-lg" ng-disabled="!model.selectedRole">SUBMIT</a>

JS：設置$scope.showGraph這裏。

$scope.renderGraph = function(){ 
    $scope.showGraph = !$scope.showGraph; 
    if($scope.showGraph) { 
     var json_response = { 
      "data": [ 
      { 
       "standard": "Ist", 
       "max_students": 20, 
       "available_students": 8 
      }, 
      { 
       "standard": "IInd", 
       "max_students": 15, 
       "available_students": 10 
      }, 
      { 
       "standard": "IIIrd", 
       "max_students": 50, 
       "available_students": 22 
      } 
      ] 
     }; 
     $scope.available_students = [ ['Ist', 8,], ['IInd', 10], ['IIIrd', 22]]; 
     $scope.maximum_students = [['Ist', 15], ['IInd',15], ['IIIrd', 50]]; 
     $scope.ordinals = ['Ist', 'IInd', 'IIIrd']; 
     console.log($scope.ordinals.length); 
     $cookieStore.put('xaxisLength',$scope.ordinals.length); 
    } 

};

來源

2016-06-21 07:19:33

無法在ng-show指令更改中調用ng變更。它只會在綁定元素髮生變化時被調用。所以你需要將ng-change放在input元素的某個地方，它使用ng-model與它綁定。

你的情況，你需要調用的人數（）在這一行

<a href="#" ng-click="HeadCount(); showGraph = !showGraph" class="btn btn-primary btn-lg"   ng-disabled="!model.selectedRole">SUBMIT</a>

我希望這將有助於。

來源

2016-06-21 07:23:02

錯誤：[$ compile：ctreq]無法找到指令'ngShow'所需的控制器'ngModel'

回答

相關問題