Angularjs 컨트롤러간에 방법을 공유

각도 확인시 this article을 읽었으며 자신의 프로젝트에서 사용하는 것이 좋을 것이라고 생각했습니다. 그것은 실제로 잘 작동하고 있으며 형식을 성공적으로 검증하면 다른 컨트롤러의 메서드에 액세스하여 확장하려고합니다. 이 작업을 수행하는 다양한 방법을 시도했지만 $ scope 개체의 메서드를 볼 수 없습니다.Angularjs 컨트롤러간에 방법을 공유

<!DOCTYPE html> 
<html> 
    <head> 
    <link data-require="[email protected]" 
     data-semver="3.0.0" 
     rel="stylesheet" 
     href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" /> 
    <script data-require="[email protected]" 
     data-semver="1.0.8" 
     src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js"></script> 
    <script src="rcSubmit.js"></script> 
    <script src="loginController.js"></script> 
    <script src="loginApp.js"></script> 
    </head> 

    <body> 
    <div class="container"> 
     <div class="row"> 
     <div class="col-xs-12 col-sm-6 col-sm-offset-3"> 
      <h1>Simple Login Form</h1> 
      <form name="loginForm" novalidate 
      ng-app="LoginApp" ng-controller="LoginController" 
      rc-submit="login()"> 
      <div class="form-group" 
       ng-class="{'has-error': rc.loginForm.needsAttention(loginForm.username)}"> 
      <input class="form-control" name="username" type="text" 
       placeholder="Username" required ng-model="session.username" /> 
      <span class="help-block" 
       ng-show="loginForm.username.$error.required">Required</span> 
      </div> 
      <div class="form-group" 
       ng-class="{'has-error': rc.loginForm.needsAttention(loginForm.password)}"> 
       <input class="form-control" name="password" type="password" 
       placeholder="Password" required ng-model="session.password" /> 
       <span class="help-block" 
       ng-show="loginForm.password.$error.required">Required</span> 
      </div> 
      <div class="form-group"> 
       <button type="submit" class="btn btn-primary pull-right" 
       value="Login" title="Login"> 
       <span>Login</span> 
       </button> 
      </div> 
      </form> 
     </div> 
     </div> 
    </div> 
    </body> 
</html>

누군가가 내가이 작업을하기 위해 누락 된 부분을 말할 수 있기를 바랬습니다. 나는 plunkr을 갈래 쳤다.

출처

2014-01-30 user686483

달성하고자하는 목표에 대해 좀 더 정확하게 설명해 주시겠습니까? 컨트롤러 간의 공유 방법이 유효성 검사와 어떤 관련이 있는지 이해하지 못합니다.일반적으로 유효성 검사를 수행하는 방법은 지시문을 작성하고 모델 컨트롤러에 액세스하는 것입니다. –

안녕하세요, 휴고, 공유 서비스에서 가지고있는 몇 가지 방법에 액세스하고 싶습니다. 이 서비스는 다른 컨트롤러에서 잘 작동하지만이 유효성 검사 코드를 사용하여이 메서드에 액세스 할 수 있습니다. 예를 들어 아래 코드에서 내 서비스의 메소드에 어떻게 액세스 할 수 있습니까? 나는 당신이 생각할 수있는 모든 것을 시도했지만 여전히 정의되지는 않습니다. // 로그인 용 컨트롤러를 정의하십시오. var LoginController = [ '$ scope', function ($ scope) { $ scope.session = {}; $ scope.login = function() { // process $ scope.session 경고 ('로그인!'); }; }]]; – user686483

적절한 방법은 각도 서비스입니다. 예를 들면 :

app.factory('svc', function() { 
    var msg="original..."; 
    return { 
     setMessage: function(x) { 
      msg=x; 
     }, 
     getMessage: function() { 
      return msg; 
     } 
    }; 
});

당신이에 svc를 주입 어떤 컨트롤러 svc 내부 fucntions에 액세스 할 수 있습니다이 방법 : 참조 this demo plunk

app.controller("ctrl1",function($scope,svc,$timeout){ 
    $scope.someText=svc.getMessage(); 
    $scope.$watch("someText",function(v){ 
    svc.setMessage(v); 
    }); 
}); 

app.controller("ctrl2",function($scope,svc){ 
    $scope.msg=svc.getMessage(); 
    $scope.$watch(svc.getMessage,function(v){ 
    $scope.msg=v; 
    }); 
});

(나는 그것을 많이했기 때문에 당신이 제공 쿵하는 소리가 무시 소음). 서비스 방법 및 양식 유효성 검사를 실행

편집

은 정말 see plunk이 서로 관련이 없습니다.

편집

당신이 다른 내부 서비스 나 하나의 응용 프로그램의 컨트롤러를 사용 당신의 주요 응용 프로그램의 종속성을 참조하고 두 번째 응용 프로그램 내에서 주요 응용 프로그램에 정의 된 서비스를 호출 할 경우. 기본 앱이 demoApp1이라면 dempApp2이라는 다른 앱을 만들고 demoApp1을 demoApp2에 만들고 demoApp1에 정의 된 서비스를 demoApp2에 정의 된 서비스로 사용할 수 있습니다. 당신이 묻고있는 것을 보여주기 위해 그것을 업데이트 한 큰 소리를보십시오.

출처

2014-01-30 09:29:27

안녕하세요, 모하마드, 질문에 너무 빨리 답변 해 주셔서 감사합니다. 나는 서비스를 시도해보고 내가 어떻게 일어나는지 알려준다. – user686483

안녕 Mohammad, 서비스 잘 작동하고 응용 프로그램에서 메서드를 공유 할 수 있지만 U 여전히 유효성 검사 컨트롤러에서 이러한 메서드를 볼 수 없습니다. 어떤 아이디어? – user686483

유효성 검사 컨트롤러에서 메서드를 보는 것이 무슨 뜻인지 이해할 수 없습니까? –

두 컨트롤러간에 통신하는 가장 좋은 방법은 이벤트를 사용하는 것입니다. 이에

Scope Documentation

는 $on, $broadcast 및 $emit을 확인하십시오.

일반적인 사용 예에서는 angular.element(catapp).scope()의 용도가 jquery 이벤트와 같이 각도 컨트롤러 외부에서 사용하도록 설계되었습니다.

이상적으로 사용에서 당신은 컨트롤러 1에 이벤트 작성합니다

$scope.$on("myEvent", function (event, args) { 
    $scope.rest_id = args.username; 
    $scope.getMainCategories(); 
});

을 그리고 두 번째 컨트롤러에 당신은

$scope.initRestId = function(){ 
    $scope.$broadcast("myEvent", {username: $scope.user.username }); 
};

당신이 firstApp 모듈 등을 포함하여 사용해 볼 수 할 것 angular.module을 선언하는 secondApp에 대한 의존성. 그렇게하면 다른 앱과 통신 할 수 있습니다.

출처

2014-11-04 12:47:18 EpokK

예제에서 두 번째 컨트롤러는 첫 번째 컨트롤러의 자식이어야합니다. 또한 첫 번째 컨트롤러가 페이지에 표시되지 않으면 아무 일도 일어나지 않습니다. –

Angularjs 컨트롤러간에 방법을 공유

답변

관련 문제