각도 - 폴리머 상호 작용

Question

모든 구성 요소가 Polymer를 사용하여 개발되는 AngularJS 프로젝트를 계획하고 있습니다.

1. 내가 (너무 UI에 의해이) 폴리머 구성 요소 데이터 모델을 업데이트 할 수 각도 서비스를 사용하여 데이터를 가져 오는 후 : 이제이 프로젝트를 시작하기 전에, 나는 쿼리의 몇 가지있다? 그렇다면 가능한 경우 예제를 공유하십시오.

2. Polymer 구성 요소 내부에서 데이터를 가져 오는 것과 같은 Angular 서비스를 호출 할 수 있습니까? (MongoDB에 대한 Angular Services를 통해 사용자 자격 증명을 검증하기위한 Polymer 구성 요소로 User Control이 있습니까?)

   가능한 경우 사례를 공유하십시오.

Answer 1

이 설정에는 몇 가지 복잡한 문제가 있습니다.

첫 번째는 각도는 사용자 지정 요소에 결합하는 방법을 알고, 그래서 같은 고분자 구성 요소에 각도 내에서 바인딩을하지 않는다는 것입니다 :

<my-element foo="{{ bar }}"> 

이 요소의 foo는 속성을 설정합니다,하는 수 문자열 일 뿐이며 Node.bind를 사용하여 foo 속성에 대한 바인딩을 설정하지 않습니다. 이것은 복잡한 오브젝트 바인딩 또는 양방향 바인딩을 원할 때 큰 문제입니다.

Node.bind를 Angular 내에서 사용할 수있는 지시문을 만들었지 만 Dart 용입니다. 당신은 그것을 JS로 포팅 할 수 있습니다 : https://github.com/google/angular_node_bind.dart

이것은 두 개의 사각 괄호로 표현식을 캡처하고 Node.bind를 통해 조사 식과 바인딩을 설정함으로써 작동합니다. 이전 예는 다음으로 변경됩니다.

<my-element foo="[[ bar ]]"> 

바인딩은 양방향입니다. <my-element>이 foo의 값을 변경하면 bar의 값이 업데이트됩니다.

두 번째 문제는 종속성 주입입니다. 브라우저는 사용자 정의 요소를 작성해야하므로 Angular는 작성시기를 알지 못하고 종속성을 주입 할 기회가 없습니다. 따라서 Polymer 요소가 앵귤러 서비스 (또는 모든 서비스 객체, 실제로는 앵글 또는 앵커)를 유지할 수있는 방법이 필요합니다.

각도 노드 바인드와 같은 것을 사용하면 바인딩을 사용하여 요소에 서비스를 전달할 수 있습니다. 어쩌면이 같은 :

<my-element http-service="[[ $http ]]"> 

(내가 정말 각도 전문가가 아니에요 때문에, 내가하지 $ HTTP 그냥 사용할 수 있음을 100 % 확신 해요, 난 그냥 각도려고 봤는데 폴리머 함께 재생 표현식에서).

Angular 팀은 Angular 2.0의 사용자 지정 요소를 지원할 것이라고 말했지만, recent blog post에는 언급하지 않았습니다.

Answer 2

중합체 요소는 단지 규칙적인 요소입니다. 속성을 설정하고 그 위에 메서드를 호출하고 해당 이벤트를 수신하면 다른 프레임 워크 나 라이브러리와 함께 사용할 때 아무런 문제가 없어야합니다. 이것은 완전히 설계된 것입니다.

Angular 및 Polymer 요소를 교차 결합하는 것이 유혹적 일 수 있지만, 이는 진보 된 것이며 꼭 필요한 것은 아닙니다. 나는 그런 식으로 시작하는 것에 대해 확실히 조언 할 것이다.