0
나는이 시점에서 벽에 부딪쳤다. 내 json 파일이 연결되었지만 (Chrome 콘솔에서 확인 됨) 내 services.html 페이지에 표시되지 않습니다. 내가 도대체 뭘 잘못하고있는 겁니까? 내 문제를 해결할 때 모든 데이터를 js 파일에 저장하고 작동시킬 수 있었지만 분명히 json 파일을 사용하여 데이터를 연결하려고합니다. AngularJS 1.6.2를 사용하고 있습니다.내 JSON 데이터가 AngularJS에 표시되지 않는 이유는 무엇입니까?
(function() {
'use strict';
// Create module and give it a name
// also include ngRoute dependency in order to route to different pages
var makeupApp = angular.module('makeupApp', ['ngRoute']);
// Configure the routes
makeupApp.config(function ($routeProvider) {
$routeProvider
// route for home page
.when('/', {
templateUrl: 'pages/home.html'
})
// route for bio page
.when('/bio', {
templateUrl: 'pages/bio.html'
})
// route for services page
.when('/services', {
templateUrl: 'pages/services.html'
})
// route for contact page
.when('/contact', {
templateUrl: 'pages/contact.html'
})
.otherwise({
templateUrl: 'pages/404.html'
});
});
makeupApp.controller('PortfolioCtrl', function() {
this.portfolio = pictures;
pictures = [
{
image: 'assets/img/photoshoot.jpg'
}
];
});
makeupApp.controller('ServicesCtrl', function ($scope, $http) {
$http.get("../assets/services.json").then(function (response) {
$scope.products = response.data;
});
});
})();<div class="container" ng-controller="ServicesCtrl as service">
<div class="row">
<!--Services Section-->
<div id="glam-menu" class="menu-container">
<div class="menu">
<div class="menu-basic text-center">
<div class="col-md-12">
<h3><span class="section-title">General Makeup Application</span></h3>
<p>voluptatibus arbitrantur illum illum sunt concursionibus cupidatat possumus
doctrina cillum labore eiusmod fidelissimae quibusdam laborum cupidatat dolor
quem ullamco sed.</p>
</div>
</div>
<div class="menu-description" ng-repeat="product in service.products">
<div class="col-md-6">
<div class="clearfix">
<div class="pull-left"><strong>{{product.general[0].name}}</strong></div>
<div class="pull-right">{{product.general[0].price | currency}}</div>
</div>
<p class="clearfix"><strong>{{product.general[0].service-description}}</strong></p>
</div>
</div>
</div>
</div>
<!--Services Section-->
</div>
</div>[{
"general": [
{
"name": "Makeup in the Studio",
"price": 60,
"service-description": "quamquam nescius multos quo singulis tamen philosophari cupidatat deserunt offendit veniam te excepteur probant laboris qui in deserunt quid legam"
},
{
"name": "On Location Makeup Service",
"price": 80,
"service-description": "Makeup application at the location of the client's choice. Price includes lashes, and travel within a 30 mile radius of the LDM Studio. All makeup at a chair are provided. Supplemental lighting and a table are not provided."
}
],
"bridal": [
{
"name": "Consultations",
"price": 60,
"service-description": "1) Price is for a second consultation for the client who has booked services. 2) Price is for first consultation if client does not book services. 3) Price is for a consultation for anyone associated with the bridal party."
},
{
"name": "Blushing Bride",
"price": 125,
"service-description": "On Location Makeup Application for your wedding."
},
{
"name": "Bridal Entourage",
"price": 80,
"service-description": "On Location Makeup application for anyone associated with the Bride on the Wedding Day."
},
{
"name": "VIP Bride",
"price": 225,
"service-description": "On Location Makeup Application and extended stay for touch ups before the ceremony and after the ceremony."
},
{
"name": "Princess Treatment",
"price": 60,
"service-description": "On Location Makeup application on Wedding Day for girls under 17 yrs old and under"
},
{
"name": "Celebrity Bride",
"price": 350,
"service-description": "On Location Makeup application for your Wedding, and 3 other Wedding related events. Includes one consultation and 30 mile travel."
},
{
"name": "Tattoo Cover",
"price": 50,
"service-description": "Starting Price. Pricing depends on size and depth of color. Please contact for more information."
}
],
"production": [
{
"name": "Half Day Rate",
"price": 250,
"service-description": "On location makeup services for up to 3.5 hours."
},
{
"name": "Full Day Rate",
"price": 500,
"service-description": "On location makeup services for up to 8 hours."
}
],
"lessons": [
{
"name": "Makeup Lesson",
"price": 125,
"service-description": "Interactive Lesson suited to client needs. Common elements listed below, but not limited to. I gear it towards your needs and wants. 1) Approx 2 hours. 2) Located at the LDM Studio. 3) Makeup bag analysis. What to keep and what to toss. 4) Feature and color analysis. 5) Techniques to achieve 2 different looks: day and night. 6) Tools and product description and suggestions. 7) False lash application lesson. 8) Hands on and demonstration teaching. 9) Post lesson open door policy. Email me about anything makeup related! Any and all questions will be answered in a timely fashion."
},
{
"name": "Concierge Makeup Shopping",
"price": 100,
"service-description": "In addition, for clients who have booked a Lesson. Don't be intimidated by large cosmetics departments or pushy sales people. I will navigate you to the products you need as well as others that you might be interested in investing in later. I will introduce you to people who can assist you in the future with your shopping experience in conjunction with my help. *Travel with client to International Plaza in Tampa, FL to shop for products."
}
]
}]
에 대한 링크입니다. 그것은 제가 전에 시도한 것들 중 하나입니다. –
문제는 배열에 객체가 객체 안에 있음을 나타냅니다. 그래서 먼저 객체에 액세스해야합니다. – Sajeetharan