在控制器依賴項中添加「$ location」數組停止ng-click從工作

我有一個按鈕，帶有一個ng-click調用，它在我的控制器數組依賴項中注入了「$ location」之前有效。函數'goToGetLocation（）'在petType.html的頂部被調用，並且該函數被定義在控制器的底部。你可以在這裏看到沒有我的按鈕都調用任何功能：http://alainwebdesign.ca/pl2/#/petType

控制器petType.html：

.controller('PetCtrl',["$location", function ($scope, $log, $location) { 
    $scope.title1 = 'Button'; 
    $scope.title4 = 'Warn'; 
    $scope.isDisabled = true; 


    $scope.activeMenu = ''; 

    var speed; 

    $scope.setSpeed = function() { 
     if ($scope.activeMenu == 'fast') { 
      speed = 46; 
      //alert(speed); 
     } 

     if ($scope.activeMenu == 'medFast') { 
      speed = 35; 
     } 

     if ($scope.activeMenu == 'medium') { 
      speed = 30; 
     } 

     if ($scope.activeMenu == 'medSlow') { 
      speed = 23; 
     } 

     if ($scope.activeMenu == 'slow') { 
      speed = 12; 
     } 

     $log.debug(speed); 
     return speed; 
    } 

    function goToGetLocation() { 
     $location.url($location.path() + "/" + speed + "/getLocation"); 
     location.reload(); 
    } 
}]);

petType.html：

<md-button ng-disabled="setSpeed() == null" ng-click="goToGetLocation()" sticky class="md-raised md-primary">Next</md-button> 

<h2></h2> 

<h2>Choose the pet type that best matches your pet</h2> 

<div style="text-align: center"> 

    <button style="height: 300px; width: 300px; display: block; margin: auto" class="button" 
    ng-class="{active : activeMenu === 'fast'}" ng-click="activeMenu = 'fast'; setSpeed();"> 
     <img height="220px" width="220px" src="images/greyhound.png" /> 
    </button> 
    <h4>Fast (Avg Speed: 46km/h)</h4> 
    <p>Includes dogs such as Greyhounds and German Shepherds</p> 
    <br> <br> 

    <button style="height: 300px; width: 300px; display: block; margin: auto" class="button" 
    ng-class="{active : activeMenu === 'medFast'}" ng-click="activeMenu = 'medFast'; setSpeed()"> 
    <img height="220px" width="220px" src="images/greatDane.png" /> 
    </button> 
    <h4>Medium/Fast (Avg Speed: 35km/h)</h4> 
    <p>Includes dogs such as Great Danes and Pitbulls</p> 
    <br> <br> 

    <button style="height: 300px; width: 300px; display: block; margin: auto" class="button" 
    ng-class="{active : activeMenu === 'med'}" ng-click="activeMenu = 'med'; setSpeed()"> 
    <img style="padding-right: 25px" height="220px" width="220px" src="images/husky.png" /> 
    </button> 
    <h4>Medium (Avg Speed: 30km/h)</h4> 
    <p>Includes dogs such as Giant Schnauzers and Siberian Huskies</p> 
    <br> <br> 

    <button style="height: 300px; width: 300px; display: block; margin: auto" class="button" 
    ng-class="{active : activeMenu === 'medSlow'}" ng-click="activeMenu = 'medSlow'; setSpeed()"> 
    <img height="220px" width="220px" src="images/golden.png" /> 
    </button> 
    <h4>Medium/Slow (Avg Speed: 23km/h)</h4> 
    <p>Includes dogs such as Golden Retrievers and Dachshunds</p> 
    <br> <br> 

    <button style="height: 300px; width: 300px; display: block; margin: auto" class="button" 
    ng-class="{active : activeMenu === 'slow'}" ng-click="activeMenu = 'slow'; setSpeed()"> 
    <img style="padding-left: 25px" height="220px" width="220px" src="images/cat.png" /> 
    </button> 
    <h4>Slow (Avg Speed: 12km/h)</h4> 
    <p>Includes cast as well as dogs such as Basset Hounds and Bulldogs</p> 
    <br> <br> 
</div>

我有一個非常類似的控制器和查看IS正在工作：

查看：http://alainwebdesign.ca/pl2/#/100/getLocation

控制器：

.controller('MapsCtrl', ['$scope', "uiGmapLogger", "uiGmapGoogleMapApi", "$interval", "$state", "$stateParams", 
     function ($scope, $log, GoogleMapApi, $interval, $state, $stateParams) { 
      $log.currentLevel = $log.LEVELS.debug; 
      var center = { latitude: parseFloat($stateParams.lat), longitude: parseFloat($stateParams.lon) }; 
      //alert(JSON.stringify(center)); 
      Object.freeze(center); //caused TypeError: Cannot assign to read only property ('latitude') ... 

      console.log($stateParams); 

      $scope.map = { 
       center: center, 
       pan: false, 
       zoom: 16, 
       refresh: false, 
       events: {}, 
       bounds: {} 
      }; 

      $scope.map.circle = { 
       id: 1, 
       center: center, 
       radius: 500, //(current time - date lost)*km/hour 
       stroke: { 
        color: '#08B21F', 
        weight: 2, 
        opacity: 1 
       }, 

       fill: { 
        color: '#08B21F', 
        opacity: 0.5 
       }, 
       geodesic: false, // optional: defaults to false 
       draggable: false, // optional: defaults to false 
       clickable: true, // optional: defaults to true 
       editable: false, // optional: defaults to false 
       visible: true, // optional: defaults to true 
       events: { 
        dblclick: function() { 
         $log.debug("circle dblclick"); 
        }, 
        radius_changed: function (gObject) { 
         var radius = gObject.getRadius(); 
         $log.debug("circle radius radius_changed " + radius); 
        } 
       } 
      } 

      //Increase Radius: 
      $interval(function() { 
       $scope.map.circle.radius += parseFloat($stateParams.speed); //dynamic var 
      }, 1000); //end of interval function 


     } ]) //end of controller

來源

2016-10-11 Tom

您的依賴項數組不完整。它應該有儘可能多的字符串PARAMS作爲函數的參數，並在相同的順序

變化

.controller('PetCtrl',["$location", function ($scope, $log, $location) {

要

.controller('PetCtrl',["$scope", "$log", "$location", function ($scope, $log, $location) {

來源

2016-10-11 00:23:36 charlietfl

真棒謝謝。調用允許點擊「下一個」的函數被調用，但點擊該按鈕（在控制器的底部）調用的函數應該改變網頁仍然沒有被調用。 – Tom

是你調用時定義的'speed'嗎？你有一個路由更改錯誤處理程序？沒有足夠的已知調試那個 – charlietfl

我已經用控制器和視圖更新了問題，它正在工作，並且類似於我當前的問題。我認爲速度已定義，否則會返回錯誤。我沒有路由更改錯誤處理程序，但我不認爲我需要一個？ – Tom

您必須使用相同數量和順序的定義控制器功能的ARGS注射。

試試這個：

.controller('PetCtrl',["$scope", "$log", "$location", function ($scope, $log, $location) {

最好的問候，

貝爾納Baumblatt

來源

2016-10-11 00:29:52

在控制器依賴項中添加「$ location」數組停止ng-click從工作

回答

相關問題