다이내믹 NG 컨트롤러 이름

다이내믹 NG 컨트롤러 이름

로드하는 Configuration에 따라 컨트롤러를 동적으로 지정합니다.다음과 같은 경우:

<div ng-controller="{{config.controllerNameString}}>
    ...
</div>

각도 어떻게 해?아주 쉬울 줄 알았는데 방법을 찾을 수 있을 것 같아요.

필요한 것은 다른 어떤 것이 호출되기 전에 다른 디렉티브를 실행하고 일부 모델에서 컨트롤러 이름을 가져와 새로운 디렉티브를 삭제하고ng-controllerdirective를 지정한 후 요소를 다시 지정합니다.

이것은 다음과 같습니다.

global.directive('dynamicCtrl', ['$compile', '$parse',function($compile, $parse) {
  return {
    restrict: 'A',
    terminal: true,
    priority: 100000,
    link: function(scope, elem) {
      var name = $parse(elem.attr('dynamic-ctrl'))(scope);
      elem.removeAttr('dynamic-ctrl');
      elem.attr('ng-controller', name);
      $compile(elem)(scope);
    }
  };
}]);

그런 다음 템플릿에서 다음과 같이 사용할 수 있습니다.

<div dynamic-ctrl="'blankCtrl'">{{tyler}}</div>

다음과 같은 컨트롤러가 있습니다.

global.controller('blankCtrl',['$scope',function(tyler){
    tyler.tyler = 'tyler';
    tyler.tyler = 'chameleon';
}]);

값을 삽입하는 방법이 있을 거예요$interpolate( )의dynamic-ctrl해석하는 대신 ($parse어떤 이유로든 작동하지 않았습니다.

ng-repeat에서 사용하고 있기 때문에 루프와 서브 오브젝트의 코드가 개선되었습니다.

템플릿:

<div class="col-xs6 col-sm-5 col-md-4 col-lg-3" ng-repeat="box in boxes">
<div ng-include src="'/assets/js/view/box_campaign.html'" ng-dynamic-controller="box.type"></div>
</div>

지시:

mainApp.directive('ngDynamicController', ['$compile', '$parse',function($compile, $parse) {
  return {
      scope: {
          name: '=ngDynamicController'
      },
      restrict: 'A',
      terminal: true,
      priority: 100000,
      link: function(scope, elem, attrs) {
          elem.attr('ng-controller', scope.name);
          elem.removeAttr('ng-dynamic-controller');

          $compile(elem)(scope);
      }
  };
}]);

처음에 요소를 컴파일할 때는 컨트롤러의 이름을 알 수 없고 나중에 다른 다이제스트 사이클을 할 때는 컨트롤러의 이름을 알 수 없기 때문에 개인적으로 여기에 있는 두 가지 솔루션은 나에게 효과가 없었습니다.그 때문에, 다음과 같은 것을 사용하게 되었습니다.

myapp.directive('dynamicController', ['$controller', function($controller) {
  return {
    restrict: 'A',
    scope: true,
    link: function(scope, elem, attrs) {
      attrs.$observe('dynamicController', function(name) {
        if (name) {
          elem.data('$Controller', $controller(name, {
            $scope: scope,
            $element: elem,
            $attrs: attrs
          }));
        }
      });
    }
  };
}]);

언급URL : https://stackoverflow.com/questions/24762229/dynamic-ng-controller-name