Polymer: как связать свойство элемента с результатом обещания?

Question

Скажем, у меня есть этот элемент:

<dom-module id="my-element"> 
    <template> 
    <auth-service is-authorized="{{isAuthorized}}"></auth-service> 
    </template> 

    <script> 
    Polymer({ 
     is: 'my-element', 

     properties: { 
     isAuthorized: { 
      type: Boolean, 
      value: false 
     } 
     }, 

     ready: function() { 
     if (this.isAuthorized) doStuff() 
     else dontDoStuff() 
     } 
    }) 
    </script> 
</dom-module> 

И этот ребенок Auth-сервисный элемент:

<dom-module id="auth-service"> 
    <script> 
    Polymer({ 
     is: 'auth-service', 

     properties: { 
     isAuthorized: { 
      type: Boolean, 
      value: false 
     } 
     }, 

     ready: function() { 
     var self = this 
     self.fetchAuthorization() 
      .then(function() { 
      self.set('isAuthorized', true) 
      }) 
      .catch(function() { 
      self.set('isAuthorized', false) 
      }) 
     }, 

     fetchAuthorization: function() { 
     //I know this is silly, but it's for the sake of the example 
     if (!localStorage.authorization) return Promise.reject('Unauthorized') 
     return Promise.resolve(JSON.parse(localStorage.authorization)) 
     } 
    }) 
    </script> 
</dom-module> 

Как я могу гарантировать, что готов обратный вызов моего-элемент будет называться только тогда, когда «fetchAuthorization» разрешено ли обещание в готовом обратном вызове auth-сервиса?

Answer 1

Добавить observer в список theAuthorized.

<dom-module id="my-element"> 
    <template> 
    <auth-service is-authorized="{{isAuthorized}}"></auth-service> 
    </template> 

    <script> 
    Polymer({ 
     is: 'my-element', 

     properties: { 
     isAuthorized: { 
      type: Boolean, 
      value: false, 
      observer: '_authorizationChanged' 
     } 
     }, 

     _authorizationChanged: function() { 
     if (this.isAuthorized) doStuff() 
     else dontDoStuff() 
     } 
    }) 
    </script> 
</dom-module>