I have tried this approach in production and ran into the following error
messages: Error: [$compile:nonassign] Expression 'undefined' used with
directive '' is non-assignable!
After a little research, I discovered this was due to two-way binding.
Since the attribute does not appear in the HTML, it binds the attribute to
undefined.
When the scope gets updated, the two-ways binding tries to update
undefined, which is illegal.
This error does not occur if you use an expression (true, false, 1 + 2)
because the value is defined.
On Saturday, April 6, 2013 2:06:14 PM UTC-4, Josh David Miller wrote:
>
> Hello!
>
> From my perspective, your best bet is to use $observe:
>
> $attrs.$observe( 'test', function( val ) {
> if ( ! angular.isDefined( val ) ) {
> $scope.test = 'Hello';
> }
> });
>
> The controller method only gets executed once; $observe will get executed
> on each interpolated change. This will allow you to react to values that
> were once defined and have become undefined or were once populated and are
> now blank, etc.
>
> Also, the controller is executed *before* the attributes are interpolated,
> so it will always be undefined when your controller runs. What's actually
> happening here is that you're assigning a scope property that just never
> gets overwritten by a new value because one wasn't provided. If you wanted
> more complicated logic (like validation) then you couldn't use that method
> at all.
>
> There's also the added benefit that this method will work seamlessly
> without the isolate scope magic, so we can follow the same pattern in child
> scope directives. We only need one trick in the bag:
>
> $attrs.$observe( 'test', function( val ) {
> $scope.test = angular.isDefined( val ) ? val : 'Hello';
> });
>
> Josh
>
>
> On Fri, Apr 5, 2013 at 6:41 PM, Jim Cooper <[email protected]<javascript:>
> > wrote:
>
>> I wondered the same thing. It does work to set the scope values in the
>> link function, btw. Just not sure if that's the intended approach.
>>
>> On Monday, July 16, 2012 5:47:22 PM UTC-6, ItsLeeOwen wrote:
>>>
>>> Is there an intended way to set default values on directive scope
>>> properties if they aren't set in the attributes? Testing in the
>>> constructor does not work.
>>>
>>> http://jsbin.com/ibeyuy/edit#javascript,html,live
>>>
>>> <my-directive></my-directive>
>>>
>>> function MyDirective( $scope )
>>> {
>>> if( $scope.test == undefined )
>>> $scope.test = 'Hello';
>>> }
>>>
>>> MyModule.directive('myDirective', function()
>>> {
>>> return {
>>> restrict: 'E',
>>> replace: true,
>>> scope: {
>>> test: '@'
>>> },
>>> template: '<div>test: {{ test }}</div>',
>>> controller: 'MyDirective'
>>> };
>>> });
>>>
>> --
>> You received this message because you are subscribed to the Google Groups
>> "AngularJS" group.
>> To unsubscribe from this group and stop receiving emails from it, send an
>> email to [email protected] <javascript:>.
>> To post to this group, send email to [email protected]<javascript:>
>> .
>> Visit this group at http://groups.google.com/group/angular?hl=en-US.
>> For more options, visit https://groups.google.com/groups/opt_out.
>>
>>
>>
>
>
--
You received this message because you are subscribed to the Google Groups
"AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.
