간단한 AngularDart 구성 요소 표시

Dart/AngularDart를 배우기 시작했습니다. 자습서 다음에 나오는 https://angulardart.org/에 간단한 구성 요소를 표시하려고 할 때 내 문제는 아무 것도 표시되지 않는 것입니다.간단한 AngularDart 구성 요소 표시

웹/nasiha.dart

import 'dart:html'; 
import 'package:angular/angular.dart'; 
import 'components/post/post.dart'; 
import 'dart:mirrors'; 

class MyAppModule extends Module { 
    MyAppModule() { 
    type(PostComponent); 
    } 
} 

void main() { 
    ngBootstrap(module: new MyAppModule()); 
}

웹/nasiha.html

<!DOCTYPE html> 

<html ng-app> 
    <head> 
    <meta charset="utf-8"> 
    <title>Nasiha</title> 
    <link rel="stylesheet" href="css/nasiha.css"> 
    </head> 
    <body> 
    <post></post> 
    <script src="packages/shadow_dom/shadow_dom.min.js"></script> 
    <script type="application/dart" src="nasiha.dart"></script> 
    <script src="packages/browser/dart.js"></script> 
    </body> 
</html>

웹/구성 요소/후/post.dart

import 'package:angular/angular.dart'; 

@NgComponent(
    selector: 'post', 
    templateUrl:'components/post/post.html', 
    cssUrl: 'components/post/post.css', 
    publishAs: 'cmp_post' 
) 
class PostComponent { 
    String text= "This is a simple text to show"; 
    String userName = "test"; 
    DateTime date= new DateTime.now(); 

    PostComponent(String text, String userName, DateTime date){ 
    this.text = text; 
    this.userName = userName; 
    this.date = date; 
    } 

    String getText(){ 
    return this.text; 
    } 
    void setText(String text){ 
    this.text = text; 
    } 
    DateTime getDate(){ 
    return this.date; 
    } 
    void setDate(DateTime date){ 
    this.date = date; 
    } 
    String getUserName(){ 
    return this.userName; 
    } 
    void setUserName(String userName){ 
    this.userName = userName; 
    } 
}

: 다음은 내 코드입니다

웹/구성 요소/게시물/post.html

<div> 
    <p ng-model="cmp_post.post_text"> 
    {{cmp_post.text}} 
    </p> 
    <div ng-model="cmp_post.post_date"> 
    {{cmp_post.date}} 
    </div> 
    <div ng-model="cmp_post.post_username"> 
    {{cmp_post.userName}} 
    </div> 
</div>

출처

2014-04-21 Youssef

난 당신의 코드에서 오류를 볼 수 없습니다를 참조하십시오. 당신이 사용하고있는 각도 어떤 버전. DartEditor 또는 Dartium의 출력은 콘솔을 사용하면 인쇄 문을 추가 할 수 있습니까? 일부 문제가 있음을 나타냅니다 DevTools로 하는가 컴포넌트가 인스턴스화되었는지 확인하기 위해 생성자에? –

'web/components/post/post.html'의'ng-model' 속성 중복됩니다. –

각도 0.0.7을 사용하고 있습니다. 인쇄 명령문을 추가했습니다. 콘솔에는 아무것도 표시되지 않았지만 콘솔에는이 명령문이 표시됩니다. C : \ Users \ Youssef \ Downloads \ Softwares \ darteditor-windows-ia32 \ dart \ chromium \ Chrome.exe --remote-debugging-port = 52980 --user-data-dir = C : \ Users \ Youssef \ .dartium --enable-experimental-web-platform-features --enable-html-imports --no -no-default-browser-check --no-process-singleton-dialog chrome : // version/ 내장 라이브러리 'dart : json'은 Dartium에서 사용할 수 없습니다. – Youssef

당신은 pubspec.yaml 상황에 맞는 메뉴에서 술집 업그레이드를 실행해야합니다.
web/components/post/post.html의 ng-model 속성은 중복됩니다.
PostComponent(String text, String userName, DateTime date){
이 코드는 유효하지 않습니다.
어느 쪽이든 당신은 생성자에 주입 할 수있는 모듈의 클래스를 등록 또는 당신은 당신이 기본 유형을 주입하는 방법을 알고 싶다면 (..., int, String 같은 double을 기본 종류를 주입 할 수 있도록 주석을 사용 또는 주입하여 주석 How can I Dependency Inject based on type and name, with AngularDart?

출처

2014-04-21 12:48:07

고마워요. – Youssef

간단한 AngularDart 구성 요소 표시

답변

관련 문제