programing

Angularjs는 컨트롤러를 문자열로 사용하여 확인합니다.

testmans 2023. 9. 27. 17:04
반응형

Angularjs는 컨트롤러를 문자열로 사용하여 확인합니다.

각도 컨트롤러를 쓰는 내 스타일은 이렇습니다(기능 대신 컨트롤러 이름 사용).

angular.module('mymodule', [
])
    .controller('myController', [
        '$scope',
        function($scope) {
            // Some code here

        }
    ]);

지금 필요한 것은 해결 부분을 정의할 iroutes를 제공할 때입니다.

 $routeProvider.when('/someroute', {
        templateUrl: 'partials/someroute.html', 
        resolve: myController.resolve}) // THIS IS THE CRITICAL LINE

컨트롤러는 이름으로 정의되어 있는데 아래의 분해 부품을 어떻게 달성합니까?

좀 더 자세히 설명해 드리자면, 경로가 해결되기 전에 서버에서 데이터를 로드한 후 컨트롤러에서 이 데이터를 사용하고자 합니다.

업데이트: 더 정확히 말하면 각 모듈에 해당 컨트롤러를 사용한 루트가 실행되기 전에 호출되는 "해결" 기능이 있으면 합니다.이 게시물의 솔루션(Misko Hervery가 답변)은 내가 원하는 대로 정확히 수행하지만 나는 기능으로서 컨트롤러를 가지고 있지 않고 이름으로 가지고 있습니다.

제어기 정의 및 해결 부분은 경로 정의에 별도로 지정해야 합니다.

모듈 수준에서 컨트롤러를 정의할 경우 해당 컨트롤러를 문자열로 참조해야 합니다.

 $routeProvider.when('/someroute', {
        templateUrl: 'partials/someroute.html', 
        controller: 'myController',
        resolve: {
          myVar: function(){
            //code to be executed before route change goes here
          };
        });

위 코드는 경로 변경 전에 해결할 변수 집합을 정의하는 방법도 보여줍니다.해결되면 해당 변수를 컨트롤러에 주입할 수 있으므로 위의 토막글의 예를 들어 컨트롤러를 다음과 같이 쓸 수 있습니다.

.controller('myController', ['$scope', 'myVar', function($scope, myVar) {
            // myVar is already resolved and injected here
        }
    ]);

이 비디오도 도움이 될 것입니다: http://www.youtube.com/watch?v=P6KITGRQujQ

@pkozlowski.opensource의 답변은 가능하지만 라우팅 및 컨트롤러를 엉망으로 만들고 싶지는 않습니다. 왜냐하면 항상 Yo Generator에서 분리된 상태로 유지하기 때문입니다.사실, 우리는 컨트롤러를 가질 수도 있고, 모두 해결할 수도 있습니다.string/name (NOT function).

angular.module('mymodule', [
])
  .controller('myController', [
      '$scope', 'myModelCombination'
      function($scope, myModelCombination) {
          // myModelCombination[0] === (resolved) myModel 
          // myModelCombination[1] === (resolved) myModel2

      }
  ])
  .controller('myController2', [
      '$scope', 'myModel'
      function($scope, myModel) {
          // Some code here

      }
  ])
  .factory('myModel', [
      '$scope',
      function($scope) {
          // return a promise

      }
  ])
  .factory('myModel2', [
      '$scope',
      function($scope) {
          // return a promise

      }
  ])
  .factory('myModelCombination', [
      '$scope', 'myModel', 'myModel2'
      function($scope) {
          return $q.all(['myModel', 'myModel2']);

      }
  ]);

그럼 라우팅 파일에 이것을 추가해야 합니다.

$routeProvider.when('/someroute', {
    templateUrl: 'partials/someroute.html', 
    resolve: ['myModel'] //ALWAYS IN ARRAY)
});
$routeProvider.when('/myModelCombination', {
    templateUrl: 'partials/someroute2.html', 
    resolve: ['myModel'] //ALWAYS IN ARRAY)
});

http://docs.angularjs.org/api/ng.$routeProvider

이것도 효과가 있을 것입니다.

var MyController = myApp.controller('MyController', ['$scope', 'myData', function($scope, myData) {
  // Some code here
}]);

MyController.resolve = {
  myData: ['$http', '$q', function($http, $q) {
    var defer = $q.defer();

    $http.get('/foo/bar')
      .success(function(data) {
        defer.resolve(data);
      })
      .error(function(error, status) {
        defer.reject(error);
      });

    return defer.promise;
  }]
};

@Truong Sinh 답변은 저에게 효과가 있었고 라우터에 추가 기능이 있는 것보다 훨씬 좋습니다.실제 해결된 데이터가 아닌 지연된 객체를 반환하는 중이라 조금 수정했습니다.

$routeProvider.when('/someroute', {
    templateUrl: 'partials/someroute.html', 
    controller: 'SomeController',
    resolve: {
       myModel: 'myModel'
    }
});

언급URL : https://stackoverflow.com/questions/14980805/angularjs-resolve-with-controller-as-string

반응형