使用属性初始化 Angular 2 组件[重复]

2024-07-04

有没有办法将参数传递到 Angular 2 组件的根?我已经能够使用属于内部组件模板一部分的组件来执行此操作,但不能使用根组件来执行此操作:

<my-component [test] = "some-val"></my-component>

在我的组件上:

export class AppComponent implements OnInit {
    test: string;

    ngOnInit() {
        console.log(this.test); //test is undefined
    }
}

这样做的原因是使用 Razor 变量传递给 Angular。例如编辑用户。我可以做类似的事情:

<edit-form [model] = "@Model.Id" > </edit-form>

Angular 不进行任何绑定index.html只能从其他组件内部。

在根组件中获取属性值的解决方法是

export class AppComponent {
  constructor(elementRef:ElementRef) {
    console.log(elementRef.nativeElement.getAttribute('inputField));
  }
}

也可以看看https://github.com/angular/angular/issues/1858 https://github.com/angular/angular/issues/1858

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

使用属性初始化 Angular 2 组件[重复] 的相关文章

  • 在 Angular 2 中动态更新 css

    假设我有一个 Angular2 组件 home component ts import Component from angular2 core Component selector home templateUrl app compone
  • Angular - 如何取消从“后退”按钮触发的路线更改?

    在我的应用程序中 我想在用户点击后退按钮时显示提示消息框或模式 我可以使用 onPopState 事件 但它不会阻止用户向后导航 到目前为止 我有这个 window onpopstate event gt event preventDefa
  • 从 Angular 的详细信息页面导航回来后保持搜索页面的状态

    我是 Angular 新手 当用户通过单击搜索结果中的链接导航到详细信息页面时 我需要维护搜索结果页面的状态 即保留搜索结果网格的排序和过滤值 网格并再次导航回搜索页面 我尝试使用 CustomReuseStartegy 但遇到两个问题 当
  • 具有传输状态的 Angular 通用 flickring

    我使用 Angular 7 和 NodeJS Express 作为后端 API 我使用 Angular Universal 进行服务器端渲染以实现 SEO 角度 SSR 网站闪烁后 我使用基于 JWT 令牌的身份验证 并在每个 Http 请
  • 如何获取 Angular 5 组件元素的位置?

    在 5 角分量中 我有一个table 我需要创建一些类似叠加多个div上面几个td的 获得这些职位的最佳方法是什么td位于表格中 以便我可以放置其他元素 我目前正在尝试使用类似的东西 ViewChild table tableElement
  • 使用按键选择 PrimeNG 表上的行

    我正在使用 PrimeNG 表 并尝试选择pSelectableRow通过按键 我有一个全局搜索输入 它将过滤表的所有结果 当用户完成搜索时 我希望他们能够单击键盘上的按钮并从过滤的选项中选择行 目前 如果用户正在搜索并且输入框获得焦点 则
  • 如何使用亚马逊 s3 服务 Angular 2

    是否可以使用 amazon s3 为 Angular 2 应用程序提供服务 而无需使用专用服务器 如果是这样如何进行 是的 您可以将应用程序部署到 AmazonS3 但不应直接从 Amazon S3 提供该应用程序 S3 是存储服务 而不是
  • 为测试床提供“entryComponents”

    我有一个组件 它接收组件的组件类以动态创建为子组件 let componentFactory this componentFactoryResolver resolveComponentFactory componentToCreate t
  • 如何在 ngFor Angular 2 中使用 trackby

    尝试了我能想到的所有语法都无法使其工作
  • 角度自动完成对象

    我正在努力了解如何在使用对象时使用角度材质自动完成 我基本上遵循 Angular 文档 只是用选项对象替换了选项数组 但我不确定如何让它工作 介意来这里看看吗 如果问题在其他地方有很多答案 我会删除该问题 这是我的 html 和 ts 组件
  • 如何使用 systemjs 在最小的 Angular 2 应用程序中加载 RxJS?

    我无法使用 RxJS 获得最小的 Angular 2 应用程序 我使用 Typescript tsc 1 6 2 和 systemjs 进行模块加载 如何让 systemjs 正确加载 Rx 模块 我已经没有办法尝试了 如果有人指出我做错了
  • 在 Angular 中创建可重用的按钮组件

    我正在尝试在 Angular 5 中创建一个组件 该组件将包含一个可重用的按钮模板 在我的应用程序按钮的不同部分将调用不同的函数 因此我希望能够告诉按钮的给定实例要调用什么函数 我知道我可以在需要的地方为按钮创建一个 HTML 标签 但我希
  • 在 Angular 中创建可重用的按钮组件

    我正在尝试在 Angular 5 中创建一个组件 该组件将包含一个可重用的按钮模板 在我的应用程序按钮的不同部分将调用不同的函数 因此我希望能够告诉按钮的给定实例要调用什么函数 我知道我可以在需要的地方为按钮创建一个 HTML 标签 但我希
  • 如何在对象数组中使用 *ngFor 循环?

    我正在学习 Angular2 所以如果我问了一个愚蠢的问题 请原谅我 我收到一个对象数组 它看起来像这样 obj json data item banana item apple item lemon 在我的组件文件中 我设法将其范围限制在
  • 如何使用@ngrx/store获取State对象的当前值?

    我的服务类在调用 Web 服务之前需要获取一个名为dataForUpdate从我的州 目前 我正在这样做 constructor public store Store lt AppState gt public APIService API
  • Angular 2:NgbModal 在视图中嵌入

    假设我有这样的模态模板 div class modal header h3 h3 div div class modal body div
  • 将 Cdk Overlay 放置在 Angular/Elements Web 组件内

    我有一个更复杂的 Angular 应用程序 我想将其部署为 Angular elements Web 组件 该应用程序使用 mat dialog 并且 Web 组件也不会占用 100 的浏览器窗口大小 我的问题是 mat dialog 的
  • 使用 NgModel 绑定将数字变成字符串

    我不明白 Typescript 和 Angular 的这种行为 我的组件 html
  • Angular 7 - 尝试在上传之前创建音频文件的预览

    我想要的结果是在将音频文件上传到服务器之前创建音频文件的预览 但是文件输入后 什么也没有发生 文件不会动态添加到 aduio 标记中 我也不会收到任何错误 控制台显示文件已加载 任何帮助将不胜感激 我的组件html有
  • 使用属性初始化 Angular 2 组件[重复]

    这个问题在这里已经有答案了 有没有办法将参数传递到 Angular 2 组件的根 我已经能够使用属于内部组件模板一部分的组件来执行此操作 但不能使用根组件来执行此操作

随机推荐