Angularjs не узнавая {{}}

Я работаю через угловую учебник и у меня есть этот вывод на фактической странице: {{product.name}} $ {{}} product.priceAngularjs не узнавая {{}}

мой HTML и JS ниже

<!DOCTYPE html> 
<html ng-app="gemStore"> 
<head> 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css"/> 
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.10/angular.min.js"></script> 
    <script type="text/javascript" src="app.js"></script> 
</head> 
<body class="container" ng-controller="StoreController as store"> 
<div class="product row" ng-repeat='product in store.products'> 
    <h3> 
     {{product.name}} 
     <em class="pull-right">${{product.price}}</em> 
    </h3> 
</div> 
</body> 
</html>

и рядом с JS

(function() { 
    var app = angular.module('gemStore', ['bootstrap-tagsinput']); 

    app.controller('StoreController', function(){ 
    this.products= gems; 
    }); 

    var gems = [ 
    { name: 'Azurite', price: 2.95 }, 
    { name: 'Bloodstone', price: 5.95 }, 
    { name: 'Zircon', price: 3.95 }, 
    ]; 
})();

Любая помощь о том, как на самом деле отображать содержимое Продукт.Название будут оценены. Также почему html не распознает эти фигурные скобки {{}} и отображает для них java-скрипт?

источник

2015-01-26 David Carek

эти скобки не отображаются в коде где-нибудь ? – djechlin

'var app = angular.module ('gemStore', ['bootstrap-tagsinput']);' – tymeJV

всякий раз, когда угловой не анализирует вашу разметку и выводит необработанные выражения, обычно это означает, что угловые сами, ваше приложение или одно ваших контроллеров не удалось загрузить правильно. Какие ошибки вы используете в консольных журналах? – Claies

Эта линия является неправильной:

var app = angular.module('bootstrap-tagsinput', 'gemStore', []);

Вы можете иметь только один главный модуль, и ваше главное приложение gemStore поэтому оно должно быть что-то вроде этого:

var app = angular.module('gemStore', ...

источник

2015-01-26 14:34:38

<div ng-app='gemStore'> 
<div class="container" ng-controller="StoreController as store"> 
<div class="product row"> 
    <h3 ng-repeat="product in products"> 
     {{product.name}} 
     <em class="pull-right">${{product.price}}</em> 
    </h3> 
</div> 
</div> 
</div>

ваших угловое файл контроллера,

var app = angular.module('gemStore', []); 

    app.controller('StoreController', function($scope){ 

    // var gems = [ 
    $scope.products=[ 
    { name: 'Azurite', price: 2.95 }, 
    { name: 'Bloodstone', price: 5.95 }, 
    { name: 'Zircon', price: 3.95 }, 
    ]; 

    });

Хотите протестировать этот код? , пожалуйста, используйте эту скрипку сделал для вас, http://jsfiddle.net/xfeh06zg/

источник

2015-01-26 14:43:26 micronyks

сделал несколько изменений по мере необходимости. если у вас есть какие-либо спецификации, дайте мне знать. – micronyks

Спасибо за ссылку скрипта, но я думаю, что это может быть проблема с тегами ссылки и скрипта в голове –

Ваш код не будет работать, поскольку вы допустили несколько ошибок! Вот почему, вместо того, чтобы предлагать вам что-нибудь, я придумал ссылку на скрипку. – micronyks

у вас нет рамки под названием product. вы должны определить продукт scope в вашем controller см jsfiddle

Просмотр

<div ng-app="gemStore"> 
    <div class="container" ng-controller="StoreController as store"> 
    <div class="product row" ng-repeat="product in store.products"> 
     <h3> 
     {{product.name}} 
     <em class="pull-right">${{product.price}}</em> 
     </h3> 
</div>

контроллер

(function() { 
    var app = angular.module('gemStore', []); 

    app.controller('StoreController', function(){ 
    this.products = gems; 
    }); 

    var gems = [ 
    { name: 'Azurite', price: 110.50 }, 
    { name: 'Bloodstone', price: 22.90 }, 
    { name: 'Zircon', price: 1100 }, 
    ]; 
})();

источник

2015-01-26 14:49:12

Я считаю, что проблема в том, что у меня не было правильного сценария SRC здесь является то, что первая ссылка и скрипт теги должны быть:

`<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css"/>`

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.10/angular.min.js"></script>

источник

2015-01-26 15:10:05

Angularjs не узнавая {{}}

ответ

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