2016-08-10 6 views
0

мерно пожалуйста, найти свой файл контроллера ..

(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"); 
     }); 
     } 
    } 
    ]; 
} 

Я не могу получить доступ к $ scope в моем файле selecthobbies.js. Есть ли способ, который я могу вызвать 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> 
+0

функция selectHobbies должна быть в контроллере в противном случае это не может получить доступ к $ scope, поскольку он привязан к контроллеру и не является глобальной переменной – Gatsbill

+0

Я хочу называть одну и ту же функцию из другого файла. – Deepa

ответ

0

Переместить файл 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"); 
     }); 
     } 
    } 
    ]; 
} 
     }) 
    })(); 
+0

Я хочу вызвать функцию из другого файла. – Deepa

1

Поскольку вы просили внешний файл, вы можете изменить свою функцию, как это:

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); 
      } 
     } 
     }] 
    }) 

, но это совсем не красиво, просто не делайте этого, если сможете. Если вам это нужно, то что-то не так с вашей функцией, пожалуйста, просто реорганизовать его лучше.

EDIT -> Вы можете сделать это с помощью службы, в гораздо лучший способ:

(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)); 
       } 
      } 
      }] 
     }) 
+0

показывает ошибку. «MyController не является функцией - не определен». – Deepa