问题标签 [angular2-ngmodel]

我制作了一个简单的 UI，它包含两个组件（父组件和子组件）。

UI 所做的是，当我在 Child 组件的输入框中键入一些内容时。该值将使用 ngModel 更改。

子组件以这种方式工作得很好。

现在我有一个父组件，我打算使用与子组件相同的值。

我将子组件添加到父模板中，并使用依赖注入来调用子组件的sharedVar.

问题是当我在输入框中输入时，值<p>会自动更改，而父组件中的值<h1>不会更改。

我有一个下拉菜单，其中包含一个复选框和项目名称。我添加了一个 ngModel 来检查项目是否应该包含在项目列表中（isChecked）。以下代码在视图中：

然后我尝试在列表中获取选中的项目，但这似乎不起作用。我知道我做错了什么，但我不知道是什么。我在不同的地方尝试了猫王操作员，但没有一个地方可以工作，所以不是这样（我认为）

我有一个带有搜索功能的下拉菜单和一个带有项目（和复选框）的列表，我想让搜索项更新该列表中的项目。

例子：

我有 5 个项目： - project1 - 马铃薯 - listItem1 - listItem2 - 不管

这个想法是，当您没有输入任何内容时，您会看到所有 5 个项目，如果您输入“p”，您只会看到 project1 和土豆。到目前为止，这是我的代码：

我想在使用属性指令键入时更改（强制）输入字段值。有了它，我想创建大写、小写、maxlength、filterchar 等指令，用于表单的输入字段。我找到了这个例子：Angular 2 Attribute Directive Typescript Example但这似乎不起作用。也许它适用于 Angular2 的早期版本。然而，这正是我想做的。

当我创建这样的指令时：

并在这样的表格上使用它：

（并注册NgModel为提供者）。我得到一个

未定义的 this.model.value。

我可以使用$event.target.value = $event.target.value.toUpperCase()（当与 一起传递$event时onInputChange()）并且适用于视图（它确实将输入显示为大写。但它不会更新绑定字段“field.name”。

那么如何创建一个 Angular2 属性指令呢？

- 编辑 -

经过进一步调查，我设法得到了我想要的东西。Günter 提供的答案更接近我的初衷，也许更好。但这里有另一种方式：

正如我所说，我不确定这是否也是这样做的好方法，因此欢迎发表评论。

我想对复选框使用双向绑定，但如果我使用[(ngModel)]它，它会显示 true 或 false 而不是选中项的值。有人知道这是怎么做到的吗？

如果我想使用双向绑定并在我的情况下将其设置为“expression.value”，我该怎么做：

在这种情况下，我想将复选框的值：选项 1 绑定到表达式类中。

我有一个这样的数组：

和这样的模板：

但是，当检查1个复选框时，这将设置为正确。我该如何单独设置？

我有一个带有如下选项的 html 选择：

角色 [] 在订阅我的服务的 observable 时被分配。一切正常，除了选择最初是空的，即使在加载角色 [] 之后也是如此。我希望选择下拉菜单在从服务加载角色 [] 时立即显示第一个选项。然后也要改变“角色”。

我正在考虑在选择或选项上使用 ngInit，但似乎无法使其正常工作。我还考虑过在返回 observable 后在组件中分配角色，但我无法弄清楚/知道这是否可能，因为在角色 [] 加载之前角色 [0] 始终为空。

如果这很重要，这是订阅代码：

}

考虑以下场景。我想使用三个NameInputComponent，每个包装一个文本输入，来构造一个FullNamesComponent：

• 两个NameInputComponents，用于一对单独的名字 ( firstName1& firstName2)
• 一NameInputComponent、共享姓氏（sharedLastName）

FullNamesComponent 应该公开两个全名：

• fullName1 = firstName1 + ' ' + sharedLastName
• fullName2 = firstName2 + ' ' + sharedLastName

将这些组件链接在一起的正确方法是什么？我尝试使用ngModel，它允许我将输入的值绑定到 中的变量NameInputComponent，但我不知道如何继续构建，以便我可以在父组件中对这些值做一些事情。据我了解，我需要使用 anEventEmitter来使父母可以消耗价值，但我不知道该怎么做。

我应该注意这没有被用作要提交的表格。我希望绑定到输出并将它们用于页面的其他部分，以及能够以编程方式/通过绑定到页面的其他部分来更改输入的内容。

这是我到目前为止所拥有的：

名称-input.component.ts

全名.component.ts

我正在使用 ionic2 和 angular2 与 javascript（不是打字稿）我有 2 个输入：文本和选择。如果 select.val() == 'more'，我想隐藏输入文本。我怎么做？

这是我的代码：

#option 上的数组是：

除此之外，我还有 2 个想法难以完成：

1 - 为选择设置一个初始值。使用 selected 不起作用，这会导致我在加载页面时始终为空。

2 - 当 input.text (price) 被隐藏时，移除属性“required”。

谢谢 ：）

我正在尝试构建一个日期时间选择器指令，如下所示。
<input [(ngModel)]="date1" datetime-picker date-only />

并被date1分配为日期，例如，new Date()

当我在 html 中显示它时，输入元素中的文本如下所示
Thu Jan 01 2015 00:00:00 GMT-0500

我想改为显示如下
2015-01-01 00:00:00

我想使用 DatePipe 在指令中格式化日期，而不是显示默认 toString() 函数的结果。

我的问题是；“在指令中，我如何访问 ngModel 变量？”，例如 date1，以便我可以添加 toString() 方法。

如果我的方法不对，请指教。