Question

我有一个输入，其中我使用双向绑定语法在一个单独的组件中填充其值：

  <input type="text" [(ngModel)]="this.inputValue" id="itemText">

在我的index.html中，我设置了inputValue的值：

  onSelect: function (request, response) {
          this.inputValue = request.item;
    }

但是，我的输入正在使用这个新值进行更新，我缺少什么？

编辑：组件设置如下：

@Component({
  selector: 'app-leftpane-table',
  templateUrl: './leftpane-table.component.html'
})
export class LeftpaneTableComponent implements OnInit {
  inputValue:any;
  constructor(private ds: DataService) { }

  ngOnInit() {}

在index.html中，一旦从搜索结果中选择了一个项目，我就会设置inputValue：

$('.ui.search')
  .search({
    apiSettings: {
      url: 'http://localhost:8088/Badges/{query}'
    },
    onSelect: function (request, response) {
        var urlApi = 'http://localhost:8088/Badges/Details/' + request.item;
        this.inputValue = request.item;
    }
});

Answer 1

请勿在Angular模板中使用this。您的输入应如下所示：

<input type="text" [(ngModel)]="inputValue" id="itemText">

编辑：

当你在this函数中引用onSelect时，你没有引用Angular组件 - 你引用了函数。你可以做的是在jQuery函数之前引用this：

const componentRef = this;
$('.ui.search')
  .search({
    apiSettings: {
      url: 'http://localhost:8088/Badges/{query}'
    },
    onSelect: function (request, response) {
        var urlApi = 'http://localhost:8088/Badges/Details/' + request.item;
        componentRef.inputValue = request.item;
    }
});

并使用此引用代替this关键字。

双向绑定角度2

1 个答案: