I'm feeling a bit lost here (edit: after clarification, my question is "Why isn't the directive recognizing the attributes passed to it?"), even though I thought I had a good grasp on it. I'm having trouble accessing the properties of the parent controller within the directive (they need to be optional, but I don't think that's the problem).
I attempted to create an isolate scope with scope: {myVar: "=?"} and then simply link a myVar attribute to the "source" in the parent controller. What am I missing?
Check out this Fiddle for reference: http://jsfiddle.net/x0mukxdd/
Here's the HTML:
<my-directive isDisabledDirectiveVar = "isDisabledOuterVar" insideDirectiveTestString = "someTestString" />
And the JS:
var app = angular.module("myApp", []);
app.controller("myController", function ($scope) {
$scope.isDisabledOuterVar = true;
$scope.someTestString = 'blahblah I am a string';
});
app.directive("myDirective", function () {
return {
restrict: 'E',
scope: {
isDisabledDirectiveVar: '=?',
insideDirectiveTestString: '=?'
},
template: '<input type = "text" ng-disabled= "isDisabledDirectiveVar"' +
'value = "{{insideTestString}}" ></input>'
};
});
Also, make sure to check out this article for more information: here.