jelgblad / angular2-masonry

https://github.com/desandro/masonry module for Angular2
101 stars 48 forks source link

Can't bind to 'options' since it isn't a known property of 'masonry' #9

Closed petrck closed 8 years ago

petrck commented 8 years ago

Hi, I have i problem with binding options property to masonry component. In console i'm giving this error:

Unhandled Promise rejection: Template parse errors:
Can't bind to 'options' since it isn't a known property of 'masonry'. ("

    <section>
        <masonry *ngIf="posts.length > 0" [ERROR ->][options]="masonryOptions" >
            <masonry-brick *ngFor="let post of posts" class="brick">
 "): ChatApp@13:42 ; Zone: <root> ; Task: Promise.then ; Value: BaseException {message: "Template parse errors:↵Can't bind to 'options' sin…post of posts" class="brick">
↵ "): ChatApp@13:42", stack: "Error: Template parse errors:↵Can't bind to 'optio…ttp://localhost:50000/Scripts/zone.min.js:1:7976)"} Error: Template parse errors:
Can't bind to 'options' since it isn't a known property of 'masonry'. ("

    <section>
        <masonry *ngIf="posts.length > 0" [ERROR ->][options]="masonryOptions" >
            <masonry-brick *ngFor="let post of posts" class="brick">
 "): ChatApp@13:42
    at new BaseException (http://localhost:50000/node_modules/@angular/compiler/bundles/compiler.umd.js:5116:27)
    at TemplateParser.parse (http://localhost:50000/node_modules/@angular/compiler/bundles/compiler.umd.js:8318:23)
    at RuntimeCompiler._compileTemplate (http://localhost:50000/node_modules/@angular/compiler/bundles/compiler.umd.js:15941:55)
    at http://localhost:50000/node_modules/@angular/compiler/bundles/compiler.umd.js:15869:87
    at Set.forEach (native)
    at compile (http://localhost:50000/node_modules/@angular/compiler/bundles/compiler.umd.js:15869:51)
    at e.invoke (http://localhost:50000/Scripts/zone.min.js:1:7347)
    at e.run (http://localhost:50000/Scripts/zone.min.js:1:4734)
    at http://localhost:50000/Scripts/zone.min.js:1:3330
    at e.invokeTask (http://localhost:50000/Scripts/zone.min.js:1:7976)

Here's my component:

import { MasonryModule, MasonryOptions } from 'angular2-masonry';

@NgModule({
    imports: [
        MasonryModule
    ]
})

@Component({
    selector: 'chat-app',
    properties: ["postformenable", "teamid"],
    templateUrl: "/angular/views/app.html",
    directives: [Post],
    styles: ['.brick { width: 250px; }']
})

export class ChatApp {
 ...
    public masonryOptions: MasonryOptions = {
        transitionDuration: '0.8s',
        percentPosition: true,
        gutter: 23    
    };
...

And app.html:

 <section>
        <masonry *ngIf="posts.length > 0" [options]="masonryOptions" >
            <masonry-brick *ngFor="let post of posts" class="brick">
            ....
          </masonry-brick>
        </masonry>
</section>

What is wrong please? Thank you.

petrck commented 8 years ago

Ok, it is BUG in readme. In ANgular 2 rc5 I need to add this: directives: [MASONRY_DIRECTIVES],

Now, all works fine. ;) #