無法訪問$範圍的角度formly

請找我的控制器文件..

(function() { 
    var app = angular.module('myApp',['formly','formlyBootstrap']) 
    app.run(function(formlyConfig) { 
    formlyConfig.setType({ 
     name: 'custom', 
     templateUrl: 'custom.html' 
    }); 
    }); 
    app.factory('jsonService', function jsonService($http){ 
     return { 
     getJSON: getJSON 
     }; 
     function getJSON(abc) { 
     console.log("Inside" + abc); 
     return $http.get('readJson.php?abc='+abc); 
     } 
    }); 
    app.controller('MyController', function ($scope) { 
    $scope.user = {}; 
    $scope.fillSecDropDown = []; 
    $scope.userFields = [{ 
     "key": "hobbies", 
     "type": "select", 
     "templateOptions": { 
      "label": "Hobbies", 
      "options":[{id:'A',title:'A'},{id:'B',title:'B'}], 
      "valueProp": "id", 
      "labelProp":"title", 
      onChange: function (abc) { 
      selectHobbies(abc); 
      } 
     } 
     }] 
    }) 
})();

selecthobbies.js文件。

function selectHobbies(abc) 
{ 
    console.log("here " + abc); 
    $scope.fillDropDown = [ // getting error here // 
    { 
     key: 'custom', 
     type: 'custom', 
     templateOptions:{ 
     options: [], 
     valueProp: 'id', 
     labelProp: 'title' 
     }, 
     controller:function($scope) { 
     console.log("here"); 
     }); 
     } 
    } 
    ]; 
}

我無法在我的selecthobbies.js文件中訪問$ scope。有什麼辦法可以調用onChange函數，它不在同一個文件中。

我收到錯誤$範圍沒有定義..

index.html文件

<html> 
<head> 
    <script src="api-check.js"></script> 
    <script src="angular.js"></script> 
    <script src="formly.js"></script> 
    <script src="jquery.min.js"></script> 
    <script src="angular-formly-templates-bootstrap.js"></script> 
    <script src="mycontroller.js"></script> 
    <script src="selecthobbies.js"></script> 
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
</head> 
</head> 
<body ng-app="myApp" ng-controller="MyController"> 
    <formly-form model="user" fields="userFields"></formly-form> 
    <formly-form model="fillSecDropDown" fields="fillDropDown"></formly-form> 
</body> 
</html>

來源

2016-08-10 Deepa

selectHobbies功能需要在控制器否則無法訪問$範圍，因爲它綁定到控制器，而不是全局變量 – Gatsbill

我想從不同的文件調用相同的函數。 – Deepa

移動你的selecthobbies.js文件。到控制器中，會是這樣的：

(function() { 
     var app = angular.module('myApp',['formly','formlyBootstrap']) 
     app.run(function(formlyConfig) { 
     formlyConfig.setType({ 
      name: 'custom', 
      templateUrl: 'custom.html' 
     }); 
     }); 
     app.factory('jsonService', function jsonService($http){ 
      return { 
      getJSON: getJSON 
      }; 
      function getJSON(abc) { 
      console.log("Inside" + abc); 
      return $http.get('readJson.php?abc='+abc); 
      } 
     }); 
     app.controller('MyController', function ($scope) { 
     $scope.user = {}; 
     $scope.fillSecDropDown = []; 
     $scope.userFields = [{ 
      "key": "hobbies", 
      "type": "select", 
      "templateOptions": { 
       "label": "Hobbies", 
       "options":[{id:'A',title:'A'},{id:'B',title:'B'}], 
       "valueProp": "id", 
       "labelProp":"title", 
       onChange: function (abc) { 
       selectHobbies(abc); 
       } 
      } 
      }]; 
     $scope.selectHobbies = function(abc){ 
console.log("here " + abc); 
    $scope.fillDropDown = [ // getting error here // 
    { 
     key: 'custom', 
     type: 'custom', 
     templateOptions:{ 
     options: [], 
     valueProp: 'id', 
     labelProp: 'title' 
     }, 
     controller:function($scope) { 
     console.log("here"); 
     }); 
     } 
    } 
    ]; 
} 
     }) 
    })();

來源

2016-08-10 10:39:40 Vicheanak

我想從不同的文件調用函數。 – Deepa

既然你問了一個外部文件，你可以改變你的函數是這樣的：

function selectHobbies(scope, abc) 
{ 
    console.log("here " + abc); 
    scope.fillDropDown = [ // getting error here // 
    { 
     key: 'custom', 
     type: 'custom', 
     templateOptions:{ 
     options: [], 
     valueProp: 'id', 
     labelProp: 'title' 
     }, 
     controller:function($scope) { 
     console.log("here"); 
     }); 
     } 
    } 
    ]; 
    return scope; 
}

，並在你的控制器：

app.controller('MyController', function ($scope) { 
    $scope.user = {}; 
    $scope.fillSecDropDown = []; 
    $scope.userFields = [{ 
     "key": "hobbies", 
     "type": "select", 
     "templateOptions": { 
      "label": "Hobbies", 
      "options":[{id:'A',title:'A'},{id:'B',title:'B'}], 
      "valueProp": "id", 
      "labelProp":"title", 
      onChange: function (abc) { 
      $scope = selectHobbies($scope, abc); 
      } 
     } 
     }] 
    })

但這並不美觀，只要不這樣做即可。如果你需要這個，那麼你的函數有些問題，請用更好的方法重構它。

編輯 - >您可以用服務做，在一個更好的方法：

(function() { 
    'use strict'; 

    angular 
     .module('yourApp') 
     .factory('yourService', yourServiceFactory); 

    function yourServiceFactory() { 
     var service = { 
     get: get 
     } 

     return service; 

     function get(abc) { 
     return { 
      key: 'custom', 
      type: 'custom', 
      templateOptions:{ 
       options: [], 
       valueProp: 'id', 
       labelProp: 'title' 
      }, 
      controller:function($scope) { 
       console.log("here"); 
      }); 
     } 
     } 
    } 
})();

然後在你的控制器：

app.controller('MyController', function ($scope, yourService) { 
     $scope.user = {}; 
     $scope.fillSecDropDown = []; 
     $scope.userFields = [{ 
      "key": "hobbies", 
      "type": "select", 
      "templateOptions": { 
       "label": "Hobbies", 
       "options":[{id:'A',title:'A'},{id:'B',title:'B'}], 
       "valueProp": "id", 
       "labelProp":"title", 
       onChange: function (abc) { 
       $scope.fillSecDropDown.push(yourService.get(abc)); 
       } 
      } 
      }] 
     })

來源

2016-08-10 10:42:40 Gatsbill

它顯示錯誤。「MyController不是一個函數 - 沒有定義。」 – Deepa

無法訪問$範圍的角度formly

回答

相關問題