2016-07-18 7 views
0

이에 대한 속성 값으로 함수 호출 내 지시어의 감소이다 :각도 : 지시어

app.directive('myDirective', function() { 
    return { 
    restrict: 'E', 
    replace: true, 
    template: 
     '<form name="form" action="{{action}}" method="post" target="_blank">' + 
     '<input type="hidden" name="item_name" value="{{itemname}}">' + 
     '</form>', 
    scope: { 
     action: '@action', 
     itemname: '@itemname', 
    }, 
    link: function(scope, element, attrs) { 
     scope.action = attrs.action || 'http://www.example.com'; 
     scope.itemname = attrs.itemname(); 
    } 
    }; 
}); 

와 나는이 방법을 사용

$scope.itemNameBuildFunction = function() { 
    return $scope.value1 + $scope.value2; 
}; 

내 지침이 연결될 때 예상됩니다 (ng-if 절 안에 있으므로 ng-if 조건이 true로 평가됨) attrs.itemname() $ scope 함수를 호출하여 컨트롤러의 링크 함수에서 scope.itemname 변수를 할당합니다.

TypeError: attrs.itemname is not a function 

당신이 나에게 몇 가지 지시 사항을 적어주세요 수 :

대신, 내가 무엇을 얻을하면 오류가 무엇입니까? 당신이 볼 수 있듯이, 나는 당신이 문 attrs.itemname() 필요하지 않습니다 :-(...

+0

지시문을 닫고 scope.itemname = attrs.itemname도 시도해 보았습니까? –

+0

이 함수는'attrs.itemname()'무엇입니까? 결코 정의 된 것을 보지 못했습니다 ... 또한 함수로 정의 된 경우 attrs가 JSON 객체로 변환합니다. 그래서 angular.fromJson (attrs.itemname) – Zargold

+0

@MandeepSingh를 사용해야합니다 : 첫 번째 조언 : 감사, 그냥 내 대답을 수정; 두 번째 조언 : 그 방법으로, 생산 된 형태로 나는'itemname'이라는 문자열을 얻을 것이다. 기대하지 않는 것은 ... :-( – MarcoS

답변

2

각도 지침을 매우 혼란 스러워요.

지침 전달 함수 참조 변수 itemname에 결합되어

scope에 그 isolated scope

그냥

scope.itemname = attrs.itemname(); 

까지 문을 변경 link 기능의 첫 번째 매개 변수로 전달됩니다 :

scope.itemname(); // this will call the function `itemNameBuildFunction` 

편집 : 당신은 원시 또는 object.You 기능을 전달하는 전달하는 경우에 사용하는 기능을 결합 ofr를 @ 연산자를 사용, 그래서, 당신은 함수로 평가합니다, & 연산자를 사용한다

.

scope: { 
     action: '@action', 
     itemname: '&itemname', 
    } 

편집 2 : 통 더 당신이 실제로없이 (자바 스크립트 객체와에 걸릴 것 '=' 유형을 원하는

+0

나는 이것이 틀렸다고 생각합니다. ... – Zargold

+0

@Zargold 무엇이 잘못 되었습니까? 정교하게 만들거나 복제 할 수 있습니까? –

+0

복제는 다음을 의미합니다 : 다른 사람이 2 분 전에 똑같은 것을 대답했습니다. 잘못된 의미 : 질문하는 사람이 가지고있는 것처럼 보입니다. itemname에 대한 함수이지만 확실하지는 않지만 정확한 장소 나 무언가에 정의하지 않았다. – Zargold

0

나에게 보인다 작업 Plunker 기능 itemNameBuildFunction()을 통과하지 itemNameBuildFunction

<my-directive action="{{ 'http://www.example.com' }}" 
    itemname="itemNameBuildFunction()" /> 

한다 JSON.parse 필요)를 사용하여 범위에서 사용할 수 있습니다. 함수는 자바 스크립트 객체로,();

그래서 가장 좋은 해결책은 다음과 같습니다. scope: { action: '@', itemname: '=', }, 이렇게하면 항목 이름에 대한 콜백을 취한 다음 적합한 것으로 범위에서 실행할 수 있습니다.

https://plnkr.co/edit/cKzLhP4SwHey266Flr5w?p=preview.

또한 사용자가 제공하는 양식을 제출하는 방법은 무엇입니까? 숨겨진 입력 이름을 제출하려면 <input type='submit'/>을 가져야합니다. 또한 templateURL을 사용하고 js에서 큰 동적 양식을 사용하는 대신 HTML 템플리트를 포함하려고합니다.