2017-07-28 91 views
1

我正在使用ng2和kendo-ui網格組件。直到我去添加另一個屬性到kendo網格組件時,我纔有了問題,現在我似乎陷入了一些奇怪的編譯器賦格狀態。錯誤代碼刪除後Angular2模板解析錯誤

錯誤在Chrome瀏覽器開發控制檯:

Unexpected character "a" (" 
    </kendo-grid-column> 
    </kendo-grid 
    [ERROR ->]appRowClick 
    [ngStyle]="{ 
     'height': showAdditionalFilters ? 'calc(100vh - 280px)' : 'calc("): ng:///FooBarModule/[email protected]:4 
Unexpected character "EOF" (Do you have an unescaped "{" in your template? Use "{{ '{' }}") to escape it.) (" 
     'width': 'calc(100vw - 130px)'}"> 

</div> 
[ERROR ->]"): ng:///FooBarModule/[email protected]:0 
Invalid ICU message. Missing '}'. (" 
     'width': 'calc(100vw - 130px)'}"> 

</div> 
[ERROR ->]"): ng:///FooBarModule/[email protected]:0 
    at syntaxError (compiler.es5.js:1690) 
    at DirectiveNormalizer.normalizeLoadedTemplate (compiler.es5.js:14132) 
    at compiler.es5.js:14118 
    at Object.then (compiler.es5.js:1679) 
    at DirectiveNormalizer.normalizeTemplateOnly (compiler.es5.js:14118) 
    at DirectiveNormalizer.normalizeTemplate (compiler.es5.js:14100) 
    at CompileMetadataResolver.loadDirectiveMetadata (compiler.es5.js:15129) 
    at compiler.es5.js:26806 
    at Array.forEach (<anonymous>) 
    at compiler.es5.js:26805 

foo.bar.html(與ngStyle):

<kendo-grid 
    appRowClick 
    [ngStyle]="{ 
     'height': showAdditionalFilters ? 'calc(100vh - 280px)' : 'calc(100vh - 180px)', 
     'width': 'calc(100vw - 130px)'}" 
    [data]="gridData" 
    [selectable]="true" 
    [sortable]="true" 
    (selectionChange)="selectionChange($event)" 
    (dataStateChange)="dataStateChange($event)">...</kendo-grid> 

所以我刪除整個[ngStyle]輸入預計會解決問題,但我仍然收到錯誤。該代碼不存在於應用程序的其他任何地方。

有誰知道可能是什麼問題?我試過重新啓動ng serve和刷新瀏覽器,但似乎都沒有工作。

foo.bar.html(不ngStyle)

<kendo-grid 
    appRowClick 
    [data]="gridData" 
    [selectable]="true" 
    [sortable]="true" 
    (selectionChange)="selectionChange($event)" 
    (dataStateChange)="dataStateChange($event)">...</kendo-grid> 
+0

除了線休息,你的ngStyle指令看起來很好。什麼是'appRowClick'屬性? – Trent

+0

它是否會編譯,如果你刪除「appRowClick」? – vidalsasoon

+0

我已經刪除了'appRowClick'指令並將ngStyle綁定表達式移到了同一行,而且我仍然看到問題。 – Blexy

回答

2

你不能有綁定表達式中的換行符

[ngStyle]="{ 
    'height': showAdditionalFilters ? 'calc(100vh - 280px)' : 'calc(100vh - 180px)', 
    'width': 'calc(100vw - 130px)'}" 

應該

[ngStyle]="{ 'height': showAdditionalFilters ? 'calc(100vh - 280px)' : 'calc(100vh - 180px)', 'width': 'calc(100vw - 130px)'}" 
+0

我刪除了整個[ngStyle]輸入,但仍然看到錯誤。思考? – Blexy

+0

我想這不是你發佈的代碼。您能否將新的錯誤信息添加到您的問題中? –

+1

你是對的,我是一個小丑。我以某種方式將相同的代碼粘貼在html的底部,所以它都是頂起來的。感謝您的幫助。 – Blexy