Не удалось привязать данные, используя двойные фигурные скобки в настройках Vuejs и systemjs

Question

У меня есть проект ASP.net mvc, где я использую Vuejs с машинописным текстом для рендеринга частей одной из моих страниц. Проблема в том, что я не могу получить свои данные, чтобы отображаться в представлении, используя двойные фигурные скобки, но когда я использую v-text, он работает. i.e это работает: <span v-text="name"></span>, но это не работает: {{name}}.

Я чувствую, что это имеет какое-то отношение к моей конфигурации Systemjs, потому что, когда я вызываю образец js-файла непосредственно в теге скрипта, я не получаю эту проблему, но когда я использую systemjs для одного и того же файла образца, проблема возвращается.

Без SystemJs и работает:

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.1.10/vue.js"></script> 
<script src="~/Areas/Admin/Content/js/vuejs/EditProductVariantsController.js"></script> 

С Systemjs и не работает:

SystemJS.config({ 
    packages: { 
     '/Areas/Admin/Content/js/vuejs': { 
      defaultExtension: 'js', 
      map: { 
       'Vue': '/Areas/Admin/node_modules/vue/dist/vue.js' 
      } 
     } 
    } 
}); 

SystemJS.import("/Areas/Admin/Content/js/vuejs/EditProductVariantsController.js"); 

и это мой vuejs код:

var Vue = require("Vue"); 

new Vue({ 
    el: "#edit-product-variants", 
    data: { name: "Mudi" } 
}); 

Моя страница требует от меня получить некоторые значения, которые не будут отображаться с использованием {{}}, а не v-text например, «id» и индекс в блоке v-for.

Поскольку я использую машинопись, я вынужден использовать загрузчик модуля, следовательно, я использую SystemJs. Пожалуйста, любая помощь будет оценена по достоинству.

Answer 1

Так что я выяснил, что в проекте также был AngularJs, и у него была проблема, потому что и AngularJs, и VueJs используют фигурные скобки. Поэтому, когда я беру Angular из проекта, все работает нормально.