无法绑定到“ngOutletContext"，因为它不是“ng-template"的已知属性 [英] Can't bind to 'ngOutletContext' since it isn't a known property of 'ng-template'

问题描述

以下在 Angular 4 中运行良好

<div *ngIf="currentUser.username !== user.username"><div class="card">布拉布拉

</ng-容器>

Angular 5 抱怨这个错误:

无法绑定到ngOutletContext"，因为它不是ng-template"的已知属性.1.如果'ngOutletContext'是一个Angular指令，那么在这个组件的'@NgModule.imports'中添加'CommonModule'.2.要允许任何属性添加'NO_ERRORS_SCHEMA'到这个组件的'@NgModule.schemas'.("<!-- 自定义模板--><ng-模板[错误 ->][ngOutletContext]="{ 项目:模型，索引:索引 }"[ngTemplateOutlet]="模板">"): ng:///TagInputModule/TagComponent.html@12:12嵌入模板上的任何指令均未使用属性绑定 ngOutletContext.确保属性名称拼写正确，并且所有指令都列在@NgModule.declarations"中.("div *ngSwitchCase="true" [attr.contenteditable]="editing"><!-- 自定义模板-->[错误 ->])在 JitCompiler._compileComponents (compiler.js:33578)在 eval (compiler.js:33448)在 Object.then (compiler.js:455)在 JitCompiler._compileModuleAndComponents (compiler.js:33447)

查看升级步骤:https://angular-update-guide.firebaseapp.com/，我似乎没有任何与 ng-template 相关的东西.

另外，这是我代码中唯一使用 <ng-template></ng-template>

我该怎么做?

解决方案

ngOutletContext 已被删除，因为它自 v4 以来已被弃用.在 angular 5

中使用 ngTemplateOutletContext 而不是 ngOutletContext

检查这个:https:///github.com/angular/angular/blob/master/CHANGELOG.md#500-beta5-2017-08-29

如果您愿意，请参加此讨论:无法让 ngTemplateOutlet 工作

Below worked fine in Angular 4

<ng-container *ngFor="let user of list_users">
  <div *ngIf="currentUser.username !== user.username">
    <div class="card">
      bla bla
    </div>
  </div>
</ng-container>

Angular 5 is whining about this error:

Can't bind to 'ngOutletContext' since it isn't a known property of 'ng-template'.
1. If 'ngOutletContext' is an Angular directive, then add 'CommonModule' to the '@NgModule.imports' of this component.
2. To allow any property add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component. ("
        <!-- CUSTOM TEMPLATE -->
        <ng-template
            [ERROR ->][ngOutletContext]="{ item: model, index: index }"
            [ngTemplateOutlet]="template">
        "): ng:///TagInputModule/TagComponent.html@12:12
Property binding ngOutletContext not used by any directive on an embedded template. Make sure that the property name is spelled correctly and all directives are listed in the "@NgModule.declarations". ("div *ngSwitchCase="true" [attr.contenteditable]="editing">
        <!-- CUSTOM TEMPLATE -->
        [ERROR ->]<ng-template
            [ngOutletContext]="{ item: model, index: index }"
            [ngTemplateOut"): ng:///TagInputModule/TagComponent.html@11:8
    at syntaxError (compiler.js:466)
    at TemplateParser.parse (compiler.js:24314)
    at JitCompiler._parseTemplate (compiler.js:33701)
    at JitCompiler._compileTemplate (compiler.js:33676)
    at eval (compiler.js:33578)
    at Set.forEach (<anonymous>)
    at JitCompiler._compileComponents (compiler.js:33578)
    at eval (compiler.js:33448)
    at Object.then (compiler.js:455)
    at JitCompiler._compileModuleAndComponents (compiler.js:33447)

Looking through the upgrade steps: https://angular-update-guide.firebaseapp.com/, I don't seem to have anything related to the ng-template thing.

Plus, that's the only place in my code I'm using <ng-template></ng-template>

How do I get this going?

解决方案

ngOutletContext has been removed as it was deprecated since v4. Use ngTemplateOutletContext instead of ngOutletContext in angular 5

Check this : https://github.com/angular/angular/blob/master/CHANGELOG.md#500-beta5-2017-08-29

and take this discussion if you want: Can't get ngTemplateOutlet to work

这篇关于无法绑定到“ngOutletContext"，因为它不是“ng-template"的已知属性的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！