2017-12-25 41 views
0

Erstellen meiner eigenen VSTS-Erweiterung. Die Erweiterung gibt ein Grid mit der Liste der Fehler im Projekt und einige Berechnungen zu diesen Fehlern zurück.VSTS-Erweiterungen Grid Control-Header-Stil

Ich möchte die Kopfzeile des Rasters stylen, um die Schrift größer und mit unterschiedlichem Hintergrund zu machen.

Ich überprüfte die Dokumentation von MS (https://www.visualstudio.com/en-us/docs/integrate/extensions/reference/client/controls/grid) und sie erwähnen die Möglichkeit, HeaderCss Klasse anzugeben. Also habe ich folgende: - ich eine CSS-Klasse in meinen HTML-Header erstellt:

<head> 
    <style> 
    .mystyle { 
     background-color: coral; 
     color: white; 
     font-size: 25px; 
    } 
    </style> 
    <title>Weighted Defect Count Calculation</title> 
    <script src="sdk/scripts/VSS.SDK.js"></script> 
</head> 

ich die Klassennamen in der Javascript hinzugefügt, wobei die Rasterspalten Optionen definiert sind:

      width: "100%", 
         height: "500px", 
         source: sourceArray, 
         columns: [ 
          { text: "ID", index: 0, width: 100, HeaderCss: { mystyle } }, 
          { text: "Title", index: 1, width: 200 }, 
          { text: "State", index: 2, width: 100 }, 
          { text: "Severity", index: 3, width: 200 }, 
          { text: "Likelihood", index: 4, width: 200 }, 
          { text: "Assigned To", index: 5, width: 300 }, 
         ] 

I Erhalte einen 401 Nicht autorisierten Fehler, wenn ich die Erweiterung ausführe. Wenn ich das HeaderCss-Ding entferne, funktioniert es perfekt.

  • Ich habe versucht "Mystyle" (mit Doppel-Qoutes). Ich bekomme Syntaxfehler
  • Ich versuchte 'Mystyle' (mit einzelnen Qoute). Ich bekomme Syntaxfehler

Jeder kann helfen?

Dokumentation von MS: https://www.visualstudio.com/en-us/docs/integrate/extensions/reference/client/controls/grid

Tutorial Ich folgte die Erweiterung zu machen, ist hier: http://nocture.dk/2016/01/02/lets-make-a-visual-studio-team-services-extension/

+0

Können Sie Ihre gesamte Erweiterung in einem Laufwerk anzeigen? Außerdem können Sie die Build-Inspector-Beispielerweiterung https://github.com/Microsoft/vsts-extension-samples/blob/master/build-inspector/src/inspector/associatedItemsGrid.ts verwenden. –

+0

Sicher. Die Datei extension index.html finden Sie hier (https://1drv.ms/u/s!AkWmBwckPdKZgQcRdU__hqwtiQVw). Dies ist die einzige Datei in der Erweiterung, die anderen sind die Standarddateien (vss-extension.json und VSS.SDK). –

+0

Ich kann dieses Problem nicht reproduzieren. Ich glaube auch nicht, dass headerCss 401 Fehler verursachen wird. Ändern Sie die Version der Erweiterung vor dem Verpacken? Sie können versuchen, Cookies des Internetbrowsers zu löschen und das Ergebnis zu überprüfen. Sie können den Code auch über das Developer Tool (F12) debuggen. Auf der anderen Seite ist der Wert von HeaderCss String statt Array oder Objekt, also sollte es wie 'HeaderCss:" mystyle "' sein. –

Antwort

0

Mit headerCss:"mystyle" statt. (Das erste Zeichen ist Kleinbuchstaben).

Auf der anderen Seite ist der Wert headerCss Zeichenfolge anstelle von Array oder Objekt.

+0

Danke. Es funktioniert jetzt. Also ist MS Dokumentation falsch, da es headerCss spezifiziert: {string} anstelle von headerCss: "string" –