src/ui/adapters/angular.js
function setupProps(scope, elem, attrs, props) {

    /*
     * For each property we are going to do the following:
     *
     * 1. See if there is an initial value
     * 2. Evaluate it against the scope via scope.$eval() so we have a resolved value
     * 3. $observe() for any changes in the property
     * 4. $watch() for any changes in the output of scope.$eval()
     *
     * One complicating factor here: while we do support passing in values such as `query` or `query-id`, these
     * values, if placed within an html template, will be passed directly on to a webcomponent BEFORE
     * this code triggers and corrects those values.  This can cause errors.
     *
     * Instead, if one passes `ng-query` or `ng-query-id` in via the html template, there is no `ng-query` property
     * to pass this value on to until the code below triggers.  The code below will map `ng-query` to `query` AFTER
     * its been evaluated.
     *
     * The above steps are applied once for `query-id`, and a second time for `ng-query-id` so that either one works, but `ng-`
     * works better.
     *
     * Best Practice therefore: Use `ng-` prefix on all properties passed via html template files.
     */
    props.forEach((prop) => {
      const ngPropertyName = prop.propertyName.indexOf('on') === 0 ?
        'ng' + prop.propertyName.substring(2) :
        'ng' + prop.propertyName.substring(0, 1).toUpperCase() + prop.propertyName.substring(1);

      // Observe for changes to the attribute value and apply them to the property value
      attrs.$observe(prop.propertyName, (value) => {
        if (elem.properties) {
          elem[prop.propertyName] = value;
        } else {
          if (!elem.properties) elem.properties = {};
          elem.properties[prop.propertyName] = value;
        }
      });

      // Observe for changes to the attribute value prefixed with "ng-" and watch the scoped expression for changes
      // that need to be applied to the property value.
      attrs.$observe(ngPropertyName, (expression) => {
        scope.$watch(expression, (value) => {
          if (!elem.properties) elem.properties = {};
          if (elem.properties._internalState && !elem.properties._internalState.disableSetters) {
            elem[prop.propertyName] = value;
          } else {
            elem.properties[prop.propertyName] = value;
          }
        });
      });
    });
  }
function setupProps(scope, elem, attrs, props) {

    /*
     * For each property we are going to do the following:
     *
     * 1. See if there is an initial value
     * 2. Evaluate it against the scope via scope.$eval() so we have a resolved value
     * 3. $observe() for any changes in the property
     * 4. $watch() for any changes in the output of scope.$eval()
     *
     * One complicating factor here: while we do support passing in values such as `query` or `query-id`, these
     * values, if placed within an html template, will be passed directly on to a webcomponent BEFORE
     * this code triggers and corrects those values.  This can cause errors.
     *
     * Instead, if one passes `ng-query` or `ng-query-id` in via the html template, there is no `ng-query` property
     * to pass this value on to until the code below triggers.  The code below will map `ng-query` to `query` AFTER
     * its been evaluated.
     *
     * The above steps are applied once for `query-id`, and a second time for `ng-query-id` so that either one works, but `ng-`
     * works better.
     *
     * Best Practice therefore: Use `ng-` prefix on all properties passed via html template files.
     */
    props.forEach((prop) => {
      const ngPropertyName = prop.propertyName.indexOf('on') === 0 ?
        'ng' + prop.propertyName.substring(2) :
        'ng' + prop.propertyName.substring(0, 1).toUpperCase() + prop.propertyName.substring(1);

      // Observe for changes to the attribute value and apply them to the property value
      attrs.$observe(prop.propertyName, (value) => {
        if (elem.properties) {
          elem[prop.propertyName] = value;
        } else {
          if (!elem.properties) elem.properties = {};
          elem.properties[prop.propertyName] = value;
        }
      });

      // Observe for changes to the attribute value prefixed with "ng-" and watch the scoped expression for changes
      // that need to be applied to the property value.
      attrs.$observe(ngPropertyName, (expression) => {
        scope.$watch(expression, (value) => {
          if (!elem.properties) elem.properties = {};
          if (elem.properties._internalState && !elem.properties._internalState.disableSetters) {
            elem[prop.propertyName] = value;
          } else {
            elem.properties[prop.propertyName] = value;
          }
        });
      });
    });
  }
function setupProps ( scope , elem , attrs , props ) { /*
     * For each property we are going to do the following:
     *
     * 1. See if there is an initial value
     * 2. Evaluate it against the scope via scope.$eval() so we have a resolved value
     * 3. $observe() for any changes in the property
     * 4. $watch() for any changes in the output of scope.$eval()
     *
     * One complicating factor here: while we do support passing in values such as `query` or `query-id`, these
     * values, if placed within an html template, will be passed directly on to a webcomponent BEFORE
     * this code triggers and corrects those values.  This can cause errors.
     *
     * Instead, if one passes `ng-query` or `ng-query-id` in via the html template, there is no `ng-query` property
     * to pass this value on to until the code below triggers.  The code below will map `ng-query` to `query` AFTER
     * its been evaluated.
     *
     * The above steps are applied once for `query-id`, and a second time for `ng-query-id` so that either one works, but `ng-`
     * works better.
     *
     * Best Practice therefore: Use `ng-` prefix on all properties passed via html template files.
     */ props . forEach ( ( prop ) => { const ngPropertyName = prop . propertyName . indexOf ( 'on' ) === 0 ? 'ng' + prop . propertyName . substring ( 2 ) : 'ng' + prop . propertyName . substring ( 0 , 1 ) . toUpperCase ( ) + prop . propertyName . substring ( 1 ) ; // Observe for changes to the attribute value and apply them to the property value attrs . $observe ( prop . propertyName , ( value ) => { if ( elem . properties ) { elem [ prop . propertyName ] = value ; } else { if ( ! elem . properties ) elem . properties = { } ; elem . properties [ prop . propertyName ] = value ; } } ) ; // Observe for changes to the attribute value prefixed with "ng-" and watch the scoped expression for changes // that need to be applied to the property value. attrs . $observe ( ngPropertyName , ( expression ) => { scope . $watch ( expression , ( value ) => { if ( ! elem . properties ) elem . properties = { } ; if ( elem . properties . _internalState && ! elem . properties . _internalState . disableSetters ) { elem [ prop . propertyName ] = value ; } else { elem . properties [ prop . propertyName ] = value ; } } ) ; } ) ; } ) ; }
Setup the properties for the given widget that is being generated
Setup the properties for the given widget that is being generated