AngularJS directive not using the scope items -
i'm quite unfamiliar angular directives , i've been trying make template work hours, can't what's wrong it.
so i'm calling directive in html page:
<div ng-controller="projectdetailscontroller vm"> <div layout="row"> <div> <img src="../../../img/monocombustionwithdryer.png" /> </div> <div> <h4>spent grains</h4> <div layout="column"> <div layout="row"> <input-widget inputlabel="dry solid content of wet bsg (% ds)" ngstyle="combwithdryer1" ngmodel="vm.selectedproject.monocombustionwithdryerscenario.bsg.percentdry" disablededition="vm.disablededition" helptext="common values between 20 , 25 % ds."></input-widget>
and defined directive in page controller:
angular.module('projects') .controller('projectdetailscontroller', projectdetailscontroller) .directive('inputwidget', function ($compile) { return { restrict: 'e', replace: true, scope: { inputlabel: '=', ngstyle: '=', ngmodel: '=', disablededition: '=', helptext: '=' }, template: '<md-input-container layout="row">' + '<label>{{inputlabel}}</label>' + '<input ng-style="ngstyle" ng-change="ngstyle={background:"#80ccff"}" ng-model="ngmodel" ng-disabled="disablededition">' + '<md-button class="help_button" aria-label="help">' + '<md-tooltip md-direction="top" md-delay="200">{{helptext}}</md-tooltip>' + '<img src="/img/help.png" />' + '</md-button>' + '</md-input-container>' }; });
yet in end, directive scope items written first template element, , not used should be:
<md-input-container layout="row" inputlabel="dry solid content of wet bsg (% ds)" ngstyle="combwithdryer1" ngmodel="vm.selectedproject.monocombustionwithdryerscenario.bsg.percentdry" disablededition="vm.disablededition" helptext="common values between 20 , 25 % ds." class="ng-isolate-scope layout-row"> <label class="ng-binding" for="input_6"></label> <input ng-style="ngstyle" ng-change="ngstyle={background:" #80ccff"}"="" ng-model="ngmodel" ng-disabled="disablededition" class="ng-pristine ng-untouched ng-valid md-input ng-empty" id="input_6" aria-invalid="false"> <div class="md-errors-spacer"></div> <button class="help_button md-button md-ink-ripple" type="button" ng-transclude="" aria-label="help"> <img src="/img/help.png" class="ng-scope"> </button>
what did miss here? many in advance.
Comments
Post a Comment