如何在typescript組件的模板URI中添加MVC視圖？

我正在MVC核心和angularjs2（與打字稿）開發應用程序。我添加了一個新組件（查看被放置在 Views \ Home \ Default.cshml），但它不起作用。如何在typescript組件的模板URI中添加MVC視圖？

請查看下面我試圖代碼：

import { Component, OnInit } from '@angular/core'; 
import { IndexService } from './index.service'; 

@Component({ 
    templateUrl: '/Home/Default', 
    //styleUrls: ['app/default/index.component.css'], 
    providers: [IndexService] 
}) 
export class IndexComponent implements OnInit { 
    pageTitle: string = 'Sign Up'; 
    imageWidth: number = 50; 
    imageMargin: number = 2; 
    showImage: boolean = false; 
    listFilter: string; 
    errorMessage: string; 

    constructor(private _indexService: IndexService) { 

    } 
    toggleImage(): void { 
     this.showImage = !this.showImage; 
    } 

    ngOnInit(): void { 
     //this._companyService.getCompanies() 
     // .subscribe(companies => this.companies = companies, 
     //     error => this.errorMessage = <any>error); 
    } 
    onRatingClicked(message: string): void { 
     this.pageTitle = 'Sign Up: ' + message; 
    } 

    onSignUpClicked(indexService: IndexService): void {  
     //this._companyService.saveCompanySignUp(company).subscribe(
     // (data) => { 
     //  this.company = data; 
     //  console.log("Item " + this.company.Id + " has been added."); 
     //  //this.router.navigate([""]); 
     // }, 
     // (error) => console.log(error) 
     //); 
    } 

} 
    public IActionResult Default() 
     { 
      return View(); 
     }

當我嘗試運行應用程序，我面臨着瀏覽器的控制檯例外。

Please specify a ShareThis Publisher Key 
For help, contact [email protected] 
util.js:211 Google Maps API warning: SensorNotRequired https://developers.google.com/maps/documentation/javascript/error-messages#sensor-not-required 
aB.j @ util.js:211 
http://localhost:5000/Home/Default Failed to load resource: the server responded with a status of 500 (Internal Server Error) 
zone.js:388 Unhandled Promise rejection: Failed to load /Home/Default ; Zone: <root> ; Task: Promise.then ; Value: Failed to load /Home/Default undefined 
consoleError @ zone.js:388 
zone.js:390 Error: Uncaught (in promise): Failed to load /Home/Default 
    at resolvePromise (zone.js:468) 
    at resolvePromise (zone.js:453) 
    at zone.js:502 
    at ZoneDelegate.invokeTask (zone.js:265) 
    at Zone.runTask (zone.js:154) 
    at drainMicroTaskQueue (zone.js:401) 
    at XMLHttpRequest.ZoneTask.invoke (zone.js:339)

來源

2017-04-03 user6306245

你真的不應該使用視圖它，只是把wwwroot文件夾內的靜態文件，那麼你不必調用/每次評估一次根。你也不需要創建十幾個控制器。最後但並非最不重要的是，要充分利用angular2，您希望將模塊中的應用程序文件捆綁在一起，將多個組件，視圖，css和服務合併爲一個文件並加載一次，而不是在100個較小的請求中加載。當他們指向一個控制器視圖時，你不能使用捆綁（服務器在npm/js/typescript構建過程中不運行） – Tseng

Tseng看起來很漂亮，但我不能完全理解。它會更有幫助如果你可以提供一個示例/示例代碼。謝謝 – user6306245

1.你需要發佈在請求期間發生的異常和2.這將超出範圍，但你應該只使用靜態文件（即把一個文件放在'wwwroot/app/components/index。 html'並設置了'templateUrl：'/ app/components/index.html'' – Tseng

使用的moduleId：module.id在組件裝飾

@Component({ 
    moduleId: module.id, 
    templateUrl: '/Home/Default', 
    //styleUrls: ['app/default/index.component.css'], 
    providers: [IndexService] 
})

來源

2017-04-03 09:44:43

謝謝你Shiva Prasad。我試過了，但我會在哪裏得到模塊ID？ – user6306245

我嘗試了與你所提到的相同的代碼，但仍然面臨同樣的例外 – user6306245

如何在typescript組件的模板URI中添加MVC視圖？

回答

相關問題