错误：[$ 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'

回答

相关问题