2015-01-04 2 views
-2

Я хочу получить все пары значений ключей в качестве объекта с помощью eval и привязать этот объект object's к тем же свойствам объекта model.Свойства объекта Bind со значениями из свойств другого объекта

<div data-bind="innerHTML: text, style: { color: color }"></div> 

Array.prototype.slice.call(document.querySelectorAll('[data-bind]')).forEach(function (el) { 
    var model = { text: 'text', color : 'red' } 
    var boundData = eval('({' + el.getAttribute('data-bind') + '})'); 
} 

Окончательный результат должен быть:

boundData.text равным текстовой собственности имущества модели

boundData.color равным цветовом собственности имущества модели

Этот пример дает мне Uncaught ReferenceError: text is not defined

+0

И? В чем проблема? Где ты застрял? –

+0

это дает мне Uncaught ReferenceError: текст не задан – theChampion

+0

Конечно, это правда, вы eval'ing '({innerHTML: text, style: {color: color}}', который является кодом, который ожидает переменную в области видимости называемый «текст» и другая переменная в области видимости «color». –

ответ

1

Если вы уже планируете использовать eval, я фигурирую вы, вероятно, не будете возражать против использования других вещей, которые большинство пользователей избегают: with. Как eval, очень ограниченное использованиеwith может быть уместным. В этом случае, это делает работу:

Array.prototype.slice.call(document.querySelectorAll('[data-bind]')).forEach(function (el) { 
    var boundData, model = { text: 'text', color : 'red' } 
    with (model) { 
     boundData = eval('({' + el.getAttribute('data-bind') + '})'); 
    } 
}); 

В результате boundData будет innerHTML и style свойства (где style является объектом с color собственности), вы должны настроить их, чтобы получить его, чтобы иметь text и color объектов недвижимости.

Пример:

var dataBindValue = "innerHTML: text, style: { color: color }"; 
 
var boundData, model = { text: 'text', color : 'red' } 
 
with (model) { 
 
    boundData = eval('({' + dataBindValue + '})'); 
 
} 
 
snippet.log("boundData.innerHTML = " + boundData.innerHTML); 
 
snippet.log("boundData.style.color = " + boundData.style.color);
<!-- Script provides the `snippet` object, see http://meta.stackexchange.com/a/242144/134069 --> 
 
<script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script>


FWIW, here's the case against using with generally.

Смежные вопросы