提交时的 SearchBar

Question

我正在尝试获取搜索栏的事件，但没有答案... 有必要再做点什么吗？

ts:

import {CompaniesViewModel} from "../../shared/models/companyModel";
import {Page} from "ui/page";
import {SearchBar} from "ui/search-bar";

export function pageLoaded(args) {
    console.log('pageLoaded');
    var page = <Page>args.object;
    page.bindingContext = new CompaniesViewModel();

    var searchBar = new SearchBar();
    searchBar.on(SearchBar.submitEvent, function (args) { 
        console.log("Search for " + (<SearchBar>args.object).text);
    });
    searchBar.on(SearchBar.clearEvent, function (args) {
        console.log("Clear");
    });
}

xms:

<SearchBar row="1" text="{{ search }}" hint="NIF ou Nome da empresa" id="search" />

Answer 1

这是因为 searchBar 变量是用新的 SearchBar 初始化的，与 XML 中定义的搜索栏无关。所以你的TS应该改成：

import {CompaniesViewModel} from "../../shared/models/companyModel";
import {Page} from "ui/page";
import {SearchBar} from "ui/search-bar";

export function pageLoaded(args) {
    console.log('pageLoaded');
    var page = <Page>args.object;
    page.bindingContext = new CompaniesViewModel();

    var searchBar = page.getViewById<SearchBar>("search");
    searchBar.on(SearchBar.submitEvent, function (args) { 
        console.log("Search for " + (<SearchBar>args.object).text);
    });
    searchBar.on(SearchBar.clearEvent, function (args) {
        console.log("Clear");
    });
}

提交时的 SearchBar

SearchBar on submit

javascript

mobile

typescript

nativescript