각도 : 지시어

Question

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

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() 필요하지 않습니다 :-(...

Answer 1

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

지침 전달 함수 참조 변수 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 : 통 더 당신이 실제로없이 (자바 스크립트 객체와에 걸릴 것 '=' 유형을 원하는

Answer 2

나에게 보인다 작업 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 템플리트를 포함하려고합니다.