AngularJS 지시문이 Python Flask와 함께 작동하지 않는 것 같습니다.

내 문제가 일반적인 문제 일지 모르지만 명확한 답변을 찾을 수 없습니다. 저는 AngularJS의 초보자입니다. 작동하지 않는 아주 간단한 코드가 있습니다. 실제로 모든 지시문이 작동하지 않습니다. 여기 HEADER.html 현재AngularJS 지시문이 Python Flask와 함께 작동하지 않는 것 같습니다.

<div> I'm supposed to see this </div>

그리고 mainapp.py

from flask import Flask, render_template 
app = Flask(__name__) 
@app.route("/") 
def mainpage(): 
    return render_template("index.html") 

if __name__ == "__main__": 
    app.run(debug=True)

아무것도에서의

<!DOCTYPE html> 
<html data-ng-app> 
<head> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script> 
</head> 
<body> 
    <div data-ng-include="'header.html'"></div> 
</body> 
</html>

가 index.html을 내 작은 프로젝트

/templates 
    -index.html 
    -header.html 
    -script.js 
mainapp.py

입니다 script.js

mainapp.py를 실행할 때 "나는 이걸 봐야한다"는 것을 기대하지만 지시어가 작동하지 않는 것 같아서 그렇지 않습니다. 그러나 html 코드를 혼자서 (예를 들어 Plunker에서) 사용하려고한다면 잘 작동합니다.

내가해야 할 구성이 있다고 가정하지만 아이디어가 없습니다. (누군가가 왜 그렇게 잘 작동하지 않는지에 대한 설명을 해줄 수 있다면)

내 지시어보다 먼저 데이터를 사용하면 문제가 변경되지 않는다는 점에 유의하십시오.

감사

출처

2017-11-24 Julien

나는 당신의 질문에 답하기 위해 오랫동안 도움을주고 싶었습니다. 팁을 주면 API를 귀하의 플라스크 API 경로에 연결하는 방법을 알고 있습니다. –

팁으로 감사 드리며, 감사합니다. 나는 그것을 찾을 수 있다면 대답을 게시 할 것이고, 그렇지 않다면 나의 desparation을 게시 할 것이다. 우리는 볼 것이다! – Julien

문제는 플라스크가 정적 파일 대 템플릿을 처리하는 방법과 관련이있다. header.html 파일은 실제 상황에서는 정적 파일이지만 플라스크 템플릿은 아닙니다. 그런 다음 업데이트

├── mainapp.py 
├── static 
│   └── partials 
│    └── header.html 
└── templates 
    └── index.html

ng-include에 :

는 귀하의 디렉토리 구조를 변경

<div data-ng-include="'header.html'"></div>

이 그랬다면, 난 심지어 "템플릿"디렉토리를 사용하지 않을 것입니다. 고정 디렉토리에서 index.html 파일을 제공하기 만하면 최종 사용자가 / 주 경로에 도달 할 때 Angular가 걸릴 수 있습니다. 그런 다음 RESTful API에 대한 AJAX 요청을 통해 서버 측과 상호 작용할 수있다.

출처

2017-11-25 00:33:15 Michael

감사합니다. 마이클,

으로 작성하면 실제로 작동합니다. 내가 이해하지 못하는 특별한 행동이 여전히있다. 파이썬이 잘 작동하고있을 때, 그러나 더블 클릭으로 html을 듣는다면 그렇지 않다.별로 중요하지 않지만 나는 조금있다. 궁금한 이유 – Julien

내 의견을 답으로 표시해주세요. – Michael

더블 클릭하면 무엇을 의미합니까? 실제 파일로 이동 한 다음 두 번 클릭하면 기본 브라우저에서 열립니다. – Michael

AngularJS 지시문이 Python Flask와 함께 작동하지 않는 것 같습니다.

답변

관련 문제