Angularjs를 사용하여 HTML 페이지에 다른 HTML 페이지 콘텐츠를 표시하는 방법

Question

웹 프로그래밍을 처음 사용합니다. 그리고 지금은 ionj를 사용하여 응용 프로그램을 작성하고 있습니다.이 프로그램에서는 주로 angularj를 사용하는 데 중점을 둡니다. 나는 어리석은 질문을하고 싶다.

내 응용 프로그램의 상황은 다른 url (.html)에 링크 된 img 링크 목록이 페이지에 단어 만 포함되어 있다는 것입니다.이 페이지는 다른 웹 사이트이므로 아무 것도 변경할 수 없습니다. 난 그냥 새 페이지로 이동하고 해당 내용을 표시하고 URL (. HTML)에서 몇 가지 CSS 스타일을하고 싶어요. 그것은 아약스하지만 angularjs를 사용하지 않고 그렇게 할 수 있습니까? 이 작업에 대한 데모가 있습니까?

**** 내 생각이 정확히 (소스 코드 포함)이 튜토리얼과 동일 **** 편집 버전 : http://css.dzone.com/articles/tutorial-how-create-responsive?page=0,2

그리고 라이브 데모 : http://www.script-tutorials.com/demos/359/index.html#!/

그러나 소스 코드 여기에 상대 경로 URL 인 <a class="xxx" href="#!/project/product1" style="background-color:#87b822"/a>을 참조하십시오.
href="http://justinjackson.ca/words.html과 같은 다른 웹 사이트를 참조하고 내 페이지의 해당 콘텐츠에 CSS 스타일을 추가 할 수 있습니까?

Answer 1

는하기의 방법 중 몇 가지가 있습니다이

1 NG-포함

당신은 예를 x에 대한 V

<div ng-include="x ? 'your-html-file.html' : null"></div> 

다음은 변경할 수 있습니다, 같은 포함 조건 NG를 사용할 수 있습니다 범위에 있습니다

$scope.x = false; 
$scope.setX = function(){$scope.x=true;} 

mg의

<img ng-click="setX()"> 

2 라우팅을 클릭

당신은 라우팅을 사용할 수 있습니다

, 당신은 각 경로를 다운로드하여 인덱스 페이지에

가 포함

모듈로 주입하여 사용할 수 있습니다

<script src="js/angular-route.js"></script> 

페이지 폴더를 만들어 페이지/부분 템플릿을 만드십시오.

이제 app.js에 당신은 정말 감사이

var youApp= angular.module('youApp', ['ngRoute']); 

    // configure our routes 
    youApp.config(function($routeProvider) { 
     $routeProvider 

      // route for the home page 
      .when('/', { 
       templateUrl : 'pages/home.html', 
       controller : 'mainController' 
      }) 

      // route for the about page 
      .when('/about', { 
       templateUrl : 'pages/about.html', 
       controller : 'aboutController' 
      }) 

      // route for the contact page 
      .when('/contact', { 
       templateUrl : 'pages/contact.html', 
       controller : 'contactController' 
      }); 
    });