사용자 지정/조건부 동작을 사용하는 각도 지시문

Question

각도 지시문에 대한 질문이 있습니다.

메인 컨트롤러 & 지시어 :

<div ng-controller='ShopsController'> 
    <update-createform shop="shop" action='update()'></update-createform> 
</div> 

지시어 JS : (방향 액션이 '행동'입력 인수를 취할 것입니다 이런 식으로)

angular.module('app') 
.directive('updateCreateform', function(){ 
    return { 
    templateUrl: '/form.html', 
    restrict : 'E', 
    scope: { 
     shop: '=', 
     action: '&' 
    } 
    } 
}) 

형태 다음은 내 코드입니다 .html 템플릿 :

<form name="shopForm" ng-submit='action(shopForm.$valid)' novalidate> 
<input type='text' name='name' required/> 
<input type='text' name='description' required/> 
</form> 

ShopsContr

exports.update = function(isValid) { 
    if (isValid) { /* update the shop*/ } 
} 

은 내가 내가 서버에서 가져 가게의 데이터를 전달하고있다 뭐하는 거지, 내가 볼 수있는 형태로 보내 및/또는 상점 정보를 업데이트 oller는 방법이있다.

동일한 양식을 사용하여 상점 정보를 만들고 싶습니다. 이 경우 나는 shop = []과 action = 'create()'를 대신 보내 준다.

내 컨트롤러에는 isValid 인수를 사용하는 업데이트 메서드가 있습니다. $ 유효한 외부 지시문을 shopForm에 전달하는 방법을 모르겠다.

두 질문 : 나는 이 지침에서 변수를 isValid 얻는 방법

1. ? 아리 러너의 NG 책에 따라
는
2. : 그는 그것이 다음을 수행하는 것이 가능했다 :

대신에 우리가

<update-createform shop="shop" on-update='update()' on-create='create()'></update-createform> 

와 지시어 '액션'을 사용하는 위의 지침을 사용

http://www.scribd.com/doc/215682987/NG-Book-The-Complete-Book-on-AngularJS-2013

상점이 비어 있지 않을 때 '업데이트'로 변경됩니다. 그렇지 않으면 액션이 '생성'과 동일합니까? 그의 코드를 시도했지만 제대로 작동하지 못합니다.

도움이 될만한 정보가 있으면 대단히 감사하겠습니다!

Answer 1

action=update(isValid)에 인수를 추가 할 수 있습니다. 그런 다음 양식 제출시 해결됩니다.

그래서 당신의 HTML이

<div ng-controller='ShopsController as shopCtrl'> 
    <update-createform shop="shop" action='shopCtrl.update(isValid)'></update-createform> 
</div> 

과 같을 것이다 그리고 당신의 형태가 될 것 같은

<form name="shopForm" ng-submit='action({isValid:shopForm.$valid})' novalidate> 
    <input type='text' name='name' required/> 
    <input type='text' name='description' required/> 
    <button type="submit">Submit</button> 
</form> 

와 컨트롤러처럼 보일 것이다

.controller('ShopsController', function() { 

    var exports = this; 

    exports.update = function(isValid) { 
    console.log(isValid) 
    if (isValid) { /* update the shop*/ } 
    } 
}) 

http://plnkr.co/edit/Qh3HzKGnOo1NTP9Pfsmh?p=preview

개인적으로 구문이 약간 이상하다고는하지만 다른 방법이 있습니다. 첫 번째 해결책은 직관적 인 것으로 느껴지지 않습니다.

http://plnkr.co/edit/CRN9ruRekJiozJIBTe80?p=preview

발견하여 지시에 대한 훌륭한 게시물에 하나의 댄 Wahlin

http://weblogs.asp.net/dwahlin/creating-custom-angularjs-directives-part-3-isolate-scope-and-function-parameters