0
我試圖填充一個下拉框，從方法，通過祕銀的觀點呈現被稱爲它的模塊之外下拉的視圖列表（不知道這個術語是正確的，但外面包含視圖，模型和控制器的屬性）。祕銀 - 如何填充從API
這個Chrome擴展增加了一個新的領域，以現有的頁面，這取決於用戶選擇，下拉框應刷新有關所選項目的項目。我可以進入獲取新項目列表的階段，但我無法獲得下拉列表以重新繪製新對象。
下面示出了被插入現有頁面內的模塊：
var ItemsList = {
model: function() {
this.list = function (id) {
var d = m.deferred()
// Calls Chrome extension bg page for retrieval of items.
chromeExt.getItems(pId, function (items) {
// Set default values initially when the controller is called.
if (items.length === 0) {
items = [
{name: 'None', value: 'none'}
]
}
d.resolve(items || [])
})
return d.promise
}
},
controller: function() {
this.model = new ItemsList.model()
this.index = m.prop(0)
this.onchange = function (e) {
console.info('ctrl:onchange', e.target)
}
// Initialise the drop down list array list.
this.dropDownItemsList = m.prop([]);
// This sets the default value of the drop down list to nothing by calling the function in the model,
// until the user selects an item which should populate the drop down list with some values.
this.getItems = function(pId) {
this.model.list(pId).then(function (data) {
this.dropDownItemsList(data)
m.redraw()
}.bind(this))
}
this.getItems(0);
},
view: function (ctrl) {
var SELECT_ID = 'record_select'
return vm.Type() ? m('div', [
m('.form__item', [
m('.label', [
m('label', {
htmlFor: SELECT_ID
}, 'ID')
]),
m('.field', [
m('select#' + SELECT_ID, {
onchange: ctrl.onchange.bind(ctrl)
},
ctrl.dropDownItemsList().map(function (it, i) {
return m('option', {
value: it.value,
checked: ctrl.model.index === i
}, it.name)
})
),
])
]),
]) : null
}
}
而且它使用 m.mount("element name here", ItemsList);
它檢查以查看是否項已改變的代碼安裝使用中的突變觀察者，並且每當它檢測到某個字段的更改時，它都會調用一個方法來獲取新值。我可以看到返回值有我的新項目。
我嘗試了各種不同的方法試圖更新下拉列表，首先嚐試設置「this.list」與我有的新項目列表，或試圖在控制器上創建可返回的方法當突變觀察者觸發時我可以調用它。
獲取新項目後，如何使下拉列表顯示已檢索的新項目？
我已經閱讀過指南，它顯示了正在運行的控制器或模型中的函數 - 但只有當它們已經被定義爲已經在視圖中使用它們時（例如，在調用該方法的視圖上有一個onclick方法）遠遠我不知道如何更新或從模塊外部調用方法。
有沒有辦法實現上述或不同的方法，我應該這樣做？