Angular 选择控件如何在不改变角度7的情况下正常工作

我使用以下方法获取第一个

选择

控制值，并根据第二个

选择

控制中显示的值

<clr-select-container>
          <select clrSelect #getList1>
            <option value="">Select </option>
            <option *ngFor="let list of dataList" value="{{list.listid}}">{{list.list_name}}</option>
          </select>
        </clr-select-container>
        <div class="clr-row">
          <div class="clr-col-5">
            <h5>Select Segment</h5>
            <select class="form-control " multiple="true" name="segment_list" id="segment_list"
              data-parsley-group="block-1">
              <option *ngFor="let segment of segments | conditionFilter:getList1.value" value="{{segment.segmentid}}">
                {{segment.segment_name}}
              </option>
            </select>
          </div>
</div>

选择
{{list.list{u name}
选择段
{{segment.segment_name}

一切正常，但问题是当我从第一个选择控件中选择不同的值时，系统没有得到任何更改事件，并且什么也没有发生，但是当我单击页面主体（在模糊上）时，第二个选择控件中填充的值

我如何设置它的行为使其正常工作

---

当我添加

（change）=“someFunction（）”

时，它工作得很好，但我不想在函数中执行任何操作，因此我认为这不是一种好的做法。

您可以在Angular上使用双向绑定，这是一种ngModel。直到它的文档支持ngModel符号。您还可以在上查看这个示例的verry basic示例，所以它应该是这样工作的

<clr-select-container>
  <select [(ngModel)] = "select1Value" clrSelect #getList1>
    <option value="">Select </option>
    <option *ngFor="let list of dataList" value="{{list.listid}}">{{list.list_name}}</option>
  </select>
</clr-select-container>
<div class="clr-row">
  <div class="clr-col-5">
    <h5>Select Segment</h5>
    <select class="form-control " multiple="true" name="segment_list" id="segment_list"
      data-parsley-group="block-1">
      <option *ngFor="let segment of segments | conditionFilter:select1Value" value="{{segment.segmentid}}">
        {{segment.segment_name}}
      </option>
    </select>
  </div>
</div>

另外，如果您没有，请不要忘记将@angular/forms中的FormsModule包含到您的模块中。 对不起，我不知道如何为stackblitz设置好的url

---

您能在stackblitz中制作此应用程序吗？？所以我们会很容易地得到你的错误。

select1Value = null;