I'm extremely new to Angular 2 and in the process of going through a
tutorial I'm somewhat stuck at implementing the custom directives.
In the HTML template the initially setup is to display *glyphicon
glyphicon-heart-empty *but if isFavorit changes it should set it to *glyphicon
glyphicon-heart if my code is written correctly. *
*as of now im not sure where the flaw is and any help you can provide
would be greatly appreciated.*
*tanks.*
*authors.component.ts*
import {Component, Input} from '@angular/core';
import {AuthorsServices} from './services/authors.services';
*import {FavoriteDirective} from './directives/favorite.directive';*
@Component({
selector: 'author',
templateUrl: 'templates/authors.template.html',
*directives: [FavoriteDirective]*,
providers: [AuthorsServices]
})
export class AuthorsComponent{
@Input() newAuthorTitle;
@Input() mediaListing;
listOfAutors: any;
authorTitle = "List of arthors1";
constructor(getAuthorList: AuthorsServices) {
this.listOfAutors = getAuthorList.getAuthorsServices();
console.log(this.listOfAutors);
}
onDelete(){
console.log('delete');
}
}
*favorite.directive.ts*
*import {Directive, HostBinding, Input} from '@angular/core';@Directive({
selector: '[mwFavorite]'})export class FavoriteDirective{
@HostBinding('class.glyphicon-heart') isFavorite = true; @Input()
set mwFavorite(value){ this.isFavorite = value;
}}authors.template.html*
<div >
{{mediaListing.name}} <br>
{{ mediaListing.medium}} <br>
{{ mediaListing.category}} <br>
{{ mediaListing.year}} <br>
<a class="delete" (click)="onDelete()"> Delete</a>
*<span *
* [mwFavorite] = "mediaListing.isFavorite";*
* class="glyphicon glyphicon-heart-empty"> </span>*
</div>
quick snippet of error received:
EXCEPTION: Error in templates/authors.template.html:8:7
ORIGINAL EXCEPTION: InvalidCharacterError: Failed to execute 'setAttribute'
on 'Element': ';' is not a valid attribute name.
--
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 https://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.
