격리 범위에 대한 10 억 개의 질문이 있지만이 정확한 문제와 직접적으로 관련이있는 질문을 찾을 수 없습니다.격리 범위 지침에서 컨트롤러 모델 얻기

내 컨트롤러의 속성이 Model이므로 .. $scope.Model입니다. 그런 다음 모델과 상호 작용해야하는 지침이 있습니다.

지시어에 격리 범위를 지정하려고하지만이 작업을 수행하면 모델에 더 이상 액세스 할 수 없기 때문에 약간 어렵다는 것을 알 수 있습니다. 나는 모델을 격리 범위에서 양방향 바인딩으로 지정하여이를 해결할 수 있다고 생각했습니다.

HTML

<body ng-app="app" ng-controller="HomeController"> 
    <div custom-directive="Model.Tags"></div> 
</body>

자바 스크립트 난 정말이 작동하지 않는 이유에 잃었어요

app.directive('customDirective', ['$parse', function($parse) { 
    return { 
     restrict: "A", 
     scope: { 
     customDirective: "=Model" 
     }, 
     link: function(scope, element, attributes){ 
     // need to access the controller's "$scope.Model" here for some things. 
     var model = scope.$eval(attributes.customDirective); 
     } 
    } 
}]) 
.controller('HomeController', ['$scope', function($scope) { 
    $scope.Model = { 
     Id: "items/1", 
     Name: "Some Model Object", 
     Tags: [] 
    }; 
}]);

. 필자가 보았던 격리 스코프 자습서 모두에 따르면, 이것은 잘되어야합니다. 매개 변수는 선택 사항이 아닙니다으로 컨트롤러를 전달

노트

. 상호 작용할 필요가있는 써드 파티 라이브러리가 이미 이것을 수행하고 있으며 분명히 동일한 HTML 요소에서 두 번 할 수 없다.

출처

2014-09-09 Ciel

사용법이 잘못되었습니다. 이것은 작동합니다 :

는

<body ng-app="app" ng-controller="HomeController"> 
    <div custom-directive="Model"></div> 
</body> 


app.directive('customDirective', [function() { 
    return { 
     restrict: "A", 
     scope: { 
     customDirective: "=" 
     }, 
     link: function(scope, element, attributes){ 
      console.log(scope.customDirective); // this is the $scope.Model due to 2-way binding 
     } 
    } 
}]) 
.controller('HomeController', ['$scope', function($scope) { 
    $scope.Model = { 
     Id: "items/1", 
     Name: "Some Model Object", 
     Tags: [] 
    }; 
}]);

출처

2014-09-09 17:46:43

오 bazing! 그게 효과가 있었어. 나는 무엇을 잘못 했는가? – Ciel

몇 가지. 1. $ scope.Model을 $ scope.Model.Tags가 아닌 $ scope.Model을 원한다면 HTML의 속성을 $ scope.Model로 설정해야합니다. 태그 만 필요하면 원래 선언을 유지할 수 있습니다. 2.'= '다음의 부분은 속성 이름과 일치해야하며,이 경우'Model'이 아닌 'customDirective'이어야합니다. 격리 된 범위에서 원하는 모델 이름을 가진 동일한 이름이면 건너 뛸 수 있으므로이 경우에는'= '만 필요합니다. 마지막으로 3. 일반 속성 액세스 구문을 통해 격리 된 범위에서 모델에 액세스 할 수 있습니다. –

오, 안돼. 나는'Model.Tags'를 원했다. 그것은 특정 속성과 상호 작용하기위한 것입니다. 그러나 그걸 멀리하기 위해서는 모델에 접근해야했습니다. – Ciel

실제로 범위에서, 속성 이름 귀하의 경우에는 지시어의 분리 범위 속성에 해당이 customDirective입니다. 는 SO 코드가 있어야한다 : -

var app=angular.module("app",[]); 
app.directive('customDirective', ['$parse', function($parse) { 
return { 
    restrict: "A", 
    scope: { 
    customDirective: "=model" 
    }, 
    link: function(scope, element, attributes){ 
    // need to access the controller's "$scope.Model" here for some things. 
     console.log(scope.customDirective); 
    } 
} 
}]); 
app.controller('HomeController', ['$scope', function($scope) { 
$scope.Model = { 
    Id: "items/1", 
    Name: "Some Model Object", 
    Tags: [] 
}; 
}]);

http://jsfiddle.net/4bb4dozv/

출처

2014-09-09 17:48:38 Akhlesh

나는 이해하지 못한다. 'Model' 대신에'model'을 사용한다는 것을 제외하고는 제 코드와 동일하게 보입니다. 왜 그렇게 갑자기 작동합니까? – Ciel

아, 알겠습니다. 'attributes' 대신'scope.customDirective'를 통해 접근합니다. – Ciel

격리 범위 지침에서 컨트롤러 모델 얻기

HTML

자바 스크립트 난 정말이 작동하지 않는 이유에 잃었어요

노트

답변

관련 문제