Я использую Mithril.JS, и похоже, что мой vm не определен там, где раньше не было.Модель просмотра IIFE, кажется, не определена
Я искал вокруг, и там очень мало с точки зрения mithril.js.
Код:
var app = {};
var apiData;
app.getData = function() {
m.request({
method: 'GET',
url: '/api/stocks',
}).then(function(data){
data = apiData;
})
};
app.App = function(data){ // model class
this.plotCfg = {
chart: {
renderTo: "plot"
},
rangeSelector: {
selected: 4
},
yAxis: {
labels: {
formatter: function() {
return (this.value > 0 ? ' + ' : '') + this.value + '%';
}
},
plotLines: [{
value: 0,
width: 2,
color: 'silver'
}]
},
plotOptions: {
series: {
compare: 'percent',
showInNavigator: true
}
},
tooltip: {
pointFormat: '<span style="color:{series.color}">{series.name}</span>: <b>{point.y}</b> ({point.change}%)<br/>',
valueDecimals: 2,
split: true
},
series: [{
name: 'Kyle\'s Chart',
data: apiData
}]
};
};
app.controller = function() { // controller
this.apk = new app.App();
this.cfg = this.apk.plotCfg;
};
app.plotter = function(ctrl) { // config class
return function(elem,isin) {
if(!isin) {
m.startComputation();
var chart = Highcharts.StockChart(ctrl.cfg);
m.endComputation();
}
};
};
app.view = function(ctrl) { // view
return m("#plot[style=height:400px]", {config: app.plotter(ctrl)})
};
app.Stock = function(data) {
this.date_added = m.prop(new Date());
this.symbol = m.prop(data.symbol);
this.id = m.prop(data.id)
};
app.SymbolList = Array;
app.vm = (function() {
var vm = {}
vm.init = function() {
//a running list of todos
vm.list = new app.SymbolList();
//a slot to store the name of a new todo before it is created
app.parseData = function (data) {
for (var i =0; i< list.length ;i++) {
console.log(list[i].stock);
var stockSymbol = data[i].stock;
vm.list.push(new app.Stock({symbol : stockSymbol}));
}
app.parseData(apiData);
vm.symbol = m.prop("");
//adds a todo to the list, and clears the description field for user convenience
vm.add = function() {
var data = vm.symbol();
if (vm.symbol()) {
data = {'text': data.toUpperCase()};
m.request({method: 'POST',
url: '/api/stocks',
data: data,
}).then(function(list) {
vm.list = [];
for (var i =0; i< list.length ;i++) {
console.log(list[i].stock);
var stockSymbol = list[i].stock;
vm.list.push(new app.Stock({symbol : stockSymbol}));
}
return;
})
vm.symbol("");
}
};
}
return vm
}
}())
app.controller2 = function() {
app.vm.init();
}
app.view2 = function() {
return [
m('input', { onchange: m.withAttr('value', app.vm.symbol), value: app.vm.symbol()}),
m('button.btn.btn-active.btn-primary', {onclick: app.vm.add}, 'Add Stock'),
m('ul', [
app.vm.list.map(function(item , index) {
return m("li", [
m('p', item.symbol())
])
})
])
]
};
m.mount(document.getElementById('chart'), {controller: app.controller, view: app.view}); //mount chart
m.mount(document.getElementById('app'), {controller: app.controller2, view: app.view2}); //mount list
<div id="app"></div>
<div id="chart"></div>
<script src="https://cdn.rawgit.com/lhorie/mithril.js/v0.2.5/mithril.js"></script>
<script src="https://code.highcharts.com/stock/highstock.js"></script>
Ошибка, которая всплывает в хроме это:
app.js:119 Uncaught TypeError: Cannot read property 'init' of undefined
at new app.controllerT (app.js:119)
at ea (mithril.js:1408)
at Function.k.mount.k.module (mithril.js:1462)
at app.js:135
Это было хорошо, прежде чем я добавил вторую точку монтирования, вид и контроллер.
Любые идеи?