6

Tôi đang phát triển một ứng dụng web với AngularJS cho giao diện người dùng và tôi đang cố gắng đặt định tuyến và hiển thị các chế độ xem, cho đến giờ ng-include và các nội dung khác hoạt động cho tôi nhưng không ng-view tôi đang phát triển trong visual studio và khi tôi chạy ứng dụng nó sử dụng một máy chủ cục bộ (localhost)AngularJS ng-view không hiển thị giao diện

đây là cấu trúc thư mục của tôi

- ASP.NET project 
---- Css 
---- Scripts 
-------- App 
-------- app.js 
----------- Home 
-------------- Controllers 
------------------ index-controller.js 
---- Views 
------- Partials 
---------- navbar.html 
------- home.html 
- index.html 

Dưới đây là mi index.html

<!DOCTYPE html> 
 
<html xmlns="http://www.w3.org/1999/xhtml"> 
 
<head> 
 
    <title>Scolaris</title> 
 
    <!--Import materialize.css--> 
 
    <link type="text/css" rel="stylesheet" href="Content/materialize/css/materialize.css" media="screen,projection" /> 
 

 
    <!--Let browser know website is optimized for mobile--> 
 
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /> 
 
</head> 
 
<body ng-app="app_module"> 
 

 
    <ng-include src="'Views/Partials/navbar.html'"/> 
 

 
    <div ng-view></div> 
 

 
    <!--Import jQuery before materialize.js--> 
 
    <script type="text/javascript" src="https://code.jquery.com/jquery-2.1.1.min.js"></script> 
 
    <script type="text/javascript" src="Content/materialize/js/materialize.js"></script> 
 
    <script type="text/javascript" src="Scripts/angular.js"></script> 
 
    <script type="text/javascript" src="Scripts/angular-route.js"></script> 
 
    <script type="text/javascript" src="Scripts/App/app.js"></script> 
 
    <script type="text/javascript" src="Scripts/App/Home/Controllers/index-controller.js"></script> 
 
    <script type="text/javascript" src="Scripts/initialization.js"></script> 
 
</body> 
 
</html>

Dưới đây là app.js tôi

'use strict'; 
 
var app_module = angular.module('app_module', ['ngRoute']); 
 
app_module.config(['$routeProvider', function ($routeProvider) { 
 
    $routeProvider 
 
     .when('/', { 
 
      templateUrl: '/Views/home.html', 
 
      controller: 'indexController' 
 
     }) 
 
     .otherwise({ 
 
      redirectTo: '/' 
 
     }); 
 
}]); 
 
/* tried with ../../Views/home.html, ../Views/home.html, etc and nothing */

Khi tôi tải các trang web nó tải một cách chính xác và nếu tôi thấy yêu cầu tôi có thể thấy rõ rằng nó yêu cầu home.html với mã trạng thái 304, điều là div với ng-view không hiển thị html bên trong home.html, điều này có thể là gì?

+1

Bất kỳ lỗi nào trong bảng điều khiển? Hãy thử xóa 'ng-include' và kiểm tra xem' ng-view tải'. – Zee

+0

@ Sourabh- Cố gắng loại bỏ ng-bao gồm và ng-xem nạp, tại sao là như vậy và làm thế nào tôi có thể làm cho nó để hai làm việc cùng nhau? – HardCodeStuds

+0

Thư mục 'index.html' và' Views' có nằm trong cùng thư mục không? –

Trả lời

0

Tôi đã giải quyết vấn đề bằng cách thay đổi thẻ <ng-include> bằng thẻ < div ng-include="srctoview">. Nếu có ai gặp vấn đề này, tôi khuyên bạn nên làm điều này hoặc làm như trong câu trả lời này using a controller

Nhờ @ Sourabh- đã dẫn tôi đến một câu trả lời.

+0

bạn đã xem câu trả lời của tôi chưa? –

0

đóng <ng-include> chỉ thị đúng cách khi trình duyệt đang bao gồm ur <ng-view> bên trong của <ng-include>. nó sẽ giải quyết vấn đề. như @pankaj đã đề xuất.

Các vấn đề liên quan