KOValidation beobachtbare Wert, $ index(), $ Daten usw. in der Fehlermeldung erhalten

Question

Ich habe folgendes JS Objekt:

var TournamentPlayer = function (PlayerName, Handicap, Nationality) { 
    var self = this; 

    self.PlayerName = ko.observable(PlayerName).extend({ 
     required: { 
      message: 'Player No. ' + $index() + ' is required.' // How to get $index() here? 
     } 
    }); 
    self.Handicap = ko.observable(Handicap); 
    self.Nationality = ko.observable(Nationality); 
} 

Ich brauche Details von vier Spielern zu erfassen, wo PlayerName erforderlich ist, ich bin mit dem folgenden Code leer TournamentPlayer Objekte im übergeordneten JS-Objekt hinzuzufügen:

self.TournamentPlayers.push(new TournamentPlayer('', 0, '')); 
self.TournamentPlayers.push(new TournamentPlayer('', 0, '')); 
self.TournamentPlayers.push(new TournamentPlayer('', 0, '')); 
self.TournamentPlayers.push(new TournamentPlayer('', 0, '')); 

I KO Daten wie der observable Wert, $index(), $data() usw. in dererhalten möchtenextend Funktion, wie kann ich das tun?

Answer 1

Mein erster Gedanke war, dies zu tun, indem Sie den Index in die Ansicht Modelle Codierung, wodurch es Einheit prüfbar:

var TournamentPlayer = function (PlayerName, Handicap, Nationality, GetNr) { 
    var self = this; 
    self.PlayerName = ko.observable(PlayerName).extend({ 
     required: { 
      message: 'Player No. ' + GetNr(self) + ' is required.' 
     } 
    }); 
} 

Dann instanziiert sie wie folgt aus:

var Root = function() { 
    self.TournamentPlayers = ko.observableArray([]); 
    self.GetNr = function(p) { return self.TournamentPlayers.indexOf(p); }; 
    self.TournamentPlayers.push(new TournamentPlayer('', 0, '', self.GetNr)); 
    // etc. 
} 

Aber das tut nicht funktionieren richtig, weil GetNr(self) einmal aufgerufen wird, auf das Konstruieren der Player, bevor es push ed in das Array (so erhalten sie alle eine Nummer -1).

Leider kann die message einer Erweiterung (AFAICT) nicht beobachtbar sein. Es gibt formatting for custom rules, wo ich denke, dass Sie von der Standardregel required "erben" und es formatierbare Nachrichten geben können.

Mit allem, was, ich fürchte, die beste Art und Weise zu tun, was Sie wollen, ist benutzerdefinierte Nachrichten in Ihrem Markup machen, so etwas wie diese:

var TournamentPlayer = function (PlayerName, Handicap, Nationality) { 
 
    var self = this; 
 
    self.PlayerName = ko.observable(PlayerName).extend({ 
 
    required: { 
 
     message: 'Player Name is required.' 
 
    } 
 
    }); 
 
} 
 

 
var Root = function() { 
 
    self.TournamentPlayers = ko.observableArray([]); 
 
    self.GetNr = function(p) { return self.TournamentPlayers.indexOf(p); }; 
 
    self.TournamentPlayers.push(new TournamentPlayer('', 0, '')); 
 
    self.TournamentPlayers.push(new TournamentPlayer('', 0, '')); 
 
    self.TournamentPlayers.push(new TournamentPlayer('', 0, '')); 
 
    self.TournamentPlayers.push(new TournamentPlayer('', 0, '')); 
 
} 
 

 
ko.applyBindings(new Root());

.validationMessage { display: none; } 
 
.customValidationMessage { color: red; }

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.0/knockout-min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout-validation/2.0.3/knockout.validation.min.js"></script> 
 

 
<ul data-bind="foreach: TournamentPlayers"> 
 
    <li> 
 
    Player Name: 
 
    <input data-bind="textInput: PlayerName"> 
 
    <span class="customValidationMessage" data-bind="visible: !PlayerName.isValid()"> 
 
     Player 
 
     <span data-bind="text: $index() + 1"></span> 
 
     is required. 
 
    </span> 
 
    </li> 
 
</ul>

Nicht schön, und ich Willkommen konkurrierende Antworten, aber am besten konnte ich bis jetzt kommen ...