如何替换 html renderPartial 中的字符串?
how to replace a string in html renderPartial?
@{ Html.RenderPartial(MVC.Shared.Views.Partials.CameraTagVideoPlayer, new CameraTagVideoPlayerViewModel("applicationVideo", "xxx")); }
我想用特定的敲除数据绑定替换 "xxx"。
例如,
<span data-bind="text: application.applicationKey"></span>
给我一个人的applicationKey。我想将此键放在 RenderPartial 中以播放视频。有办法吗?
编辑:
public static class Partials
{
public readonly static string _CurvedSelector = "~/Views/Shared/Partials/_CurvedSelector.cshtml";
public readonly static string SelectMonthOptions = "~/Views/Shared/Partials/SelectMonthOptions.cshtml";
public readonly static string SelectStateOptions = "~/Views/Shared/Partials/SelectStateOptions.cshtml";
public readonly static string SelectYearOptions = "~/Views/Shared/Partials/SelectYearOptions.cshtml";
public readonly static string ToggleButton = "~/Views/Shared/Partials/ToggleButton.cshtml";
public readonly static string CameraTagVideoPlayer = "~/Views/Shared/Partials/CameraTagVideoPlayer.cshtml";
public readonly static string CreditCardFormFields = "~/Views/Shared/Partials/CreditCardFormFields.cshtml";
public readonly static string CreditCardJavascript = "~/Views/Shared/Partials/CreditCardJavascript.cshtml";
public readonly static string AntiBotFormFields = "~/Views/Shared/Partials/AntiBotFormFields.cshtml";
public readonly static string ExitModal = "~/Views/Shared/Partials/ExitModal.cshtml";
}
cameratagvideoplayer.html :
@model CameraTagVideoPlayerViewModel
@{
// CameraTag video security
long expiration = Utilities.ToUnixTimestamp(DateTime.UtcNow.AddMinutes(30)); // can be no more than 1 hour
string signature = Utilities.CreateTokenHmacSha1(expiration.ToString(), AppSettings.Current.CameraTagRestApiKey);
}
<player id="@Model.Id"
data-uuid='@(Model.VideoUuid)'
data-options='{"width":"100%","height":"100%", "aspectratio":"4:3", "displaytitle":"false","displaydescription":"false"}'
data-signature="@signature" data-signature-expiration="@expiration"></player>
如果在重新显示此视图时启用了剔除,您可以使用 attr 绑定 (http://knockoutjs.com/documentation/attr-binding.html):
<player id="@Model.Id"
data-bind="attr: { 'data-uuid': application.applicationKey }"
data-options='{"width":"100%","height":"100%", "aspectratio":"4:3", "displaytitle":"false","displaydescription":"false"}'
data-signature="@signature"
data-signature-expiration="@expiration">
</player>
希望这对您有所帮助。
更新 1
这个问题是关于相机标签(https://cameratag.com/)的。这个 javascript 库找到 <player>
个带有 onload 事件的标签。您可以添加新标签,但不能修改现有标签。
您可以创建一个自定义绑定,在每次更改时创建一个新的 <player>
标记(当然,删除旧标记):
ko.bindingHandlers.uuid = {
update: function(element, valueAccessor, allBindings) {
// First get the latest data that we're bound to
var value = valueAccessor();
//console.log(allBindings())
// Next, whether or not the supplied model property is observable, get its current value
var valueUnwrapped = ko.unwrap(value);
var parentId = `${$(element).attr('id')}`
var childId = `${parentId}_child`
var childIdHash = `#${parentId}_child`
// Delete de old <player>
$(childIdHash).remove();
var player = $('<player></player>')
.attr('id',childId)
.attr('data-uuid',valueUnwrapped)
.insertAfter($(element))
$.each($(element).data(),function (key, value) {
if (key !== 'bind' && key !== 'options'){
var temp = value;
if (typeof(value) !== 'string'){
// For example, data-options:
// data-options='{"width":"100%","height":"100%", "aspectratio":"4:3", "displaytitle":"false","displaydescription":"false"}'
temp = {}
$.each(value,function(key1,value1){
temp[key1] = value1;
})
}
player.attr(`data-${key}`,temp);
console.log(`x) ${key} : ${value}`);
console.log(value)
}
})
CameraTag.setup();
}
};
此绑定还复制原始元素的 data-...
属性。
那么,可以这样使用:
<player id="DemoPlayer"
data-bind="uuid: uuid"
data-options='{"width":"100%","height":"100%", "aspectratio":"4:3", "displaytitle":"false","displaydescription":"false"}'
data-signature="@signature"
data-signature-expiration="@expiration">
</player>
和视图模型:
function ViewModel() {
var self = this;
self.uuid = ko.observable('v-1237c41f-9038-44b7-b4cc-8cb1f13f6f76')
}
ko.applyBindings(new ViewModel());
这里是fiddle to play with. In the edit box you can change the key. The key of this example is found in this url: player example.
@{ Html.RenderPartial(MVC.Shared.Views.Partials.CameraTagVideoPlayer, new CameraTagVideoPlayerViewModel("applicationVideo", "xxx")); }
我想用特定的敲除数据绑定替换 "xxx"。
例如,
<span data-bind="text: application.applicationKey"></span>
给我一个人的applicationKey。我想将此键放在 RenderPartial 中以播放视频。有办法吗?
编辑:
public static class Partials
{
public readonly static string _CurvedSelector = "~/Views/Shared/Partials/_CurvedSelector.cshtml";
public readonly static string SelectMonthOptions = "~/Views/Shared/Partials/SelectMonthOptions.cshtml";
public readonly static string SelectStateOptions = "~/Views/Shared/Partials/SelectStateOptions.cshtml";
public readonly static string SelectYearOptions = "~/Views/Shared/Partials/SelectYearOptions.cshtml";
public readonly static string ToggleButton = "~/Views/Shared/Partials/ToggleButton.cshtml";
public readonly static string CameraTagVideoPlayer = "~/Views/Shared/Partials/CameraTagVideoPlayer.cshtml";
public readonly static string CreditCardFormFields = "~/Views/Shared/Partials/CreditCardFormFields.cshtml";
public readonly static string CreditCardJavascript = "~/Views/Shared/Partials/CreditCardJavascript.cshtml";
public readonly static string AntiBotFormFields = "~/Views/Shared/Partials/AntiBotFormFields.cshtml";
public readonly static string ExitModal = "~/Views/Shared/Partials/ExitModal.cshtml";
}
cameratagvideoplayer.html :
@model CameraTagVideoPlayerViewModel
@{
// CameraTag video security
long expiration = Utilities.ToUnixTimestamp(DateTime.UtcNow.AddMinutes(30)); // can be no more than 1 hour
string signature = Utilities.CreateTokenHmacSha1(expiration.ToString(), AppSettings.Current.CameraTagRestApiKey);
}
<player id="@Model.Id"
data-uuid='@(Model.VideoUuid)'
data-options='{"width":"100%","height":"100%", "aspectratio":"4:3", "displaytitle":"false","displaydescription":"false"}'
data-signature="@signature" data-signature-expiration="@expiration"></player>
如果在重新显示此视图时启用了剔除,您可以使用 attr 绑定 (http://knockoutjs.com/documentation/attr-binding.html):
<player id="@Model.Id"
data-bind="attr: { 'data-uuid': application.applicationKey }"
data-options='{"width":"100%","height":"100%", "aspectratio":"4:3", "displaytitle":"false","displaydescription":"false"}'
data-signature="@signature"
data-signature-expiration="@expiration">
</player>
希望这对您有所帮助。
更新 1
这个问题是关于相机标签(https://cameratag.com/)的。这个 javascript 库找到 <player>
个带有 onload 事件的标签。您可以添加新标签,但不能修改现有标签。
您可以创建一个自定义绑定,在每次更改时创建一个新的 <player>
标记(当然,删除旧标记):
ko.bindingHandlers.uuid = {
update: function(element, valueAccessor, allBindings) {
// First get the latest data that we're bound to
var value = valueAccessor();
//console.log(allBindings())
// Next, whether or not the supplied model property is observable, get its current value
var valueUnwrapped = ko.unwrap(value);
var parentId = `${$(element).attr('id')}`
var childId = `${parentId}_child`
var childIdHash = `#${parentId}_child`
// Delete de old <player>
$(childIdHash).remove();
var player = $('<player></player>')
.attr('id',childId)
.attr('data-uuid',valueUnwrapped)
.insertAfter($(element))
$.each($(element).data(),function (key, value) {
if (key !== 'bind' && key !== 'options'){
var temp = value;
if (typeof(value) !== 'string'){
// For example, data-options:
// data-options='{"width":"100%","height":"100%", "aspectratio":"4:3", "displaytitle":"false","displaydescription":"false"}'
temp = {}
$.each(value,function(key1,value1){
temp[key1] = value1;
})
}
player.attr(`data-${key}`,temp);
console.log(`x) ${key} : ${value}`);
console.log(value)
}
})
CameraTag.setup();
}
};
此绑定还复制原始元素的 data-...
属性。
那么,可以这样使用:
<player id="DemoPlayer"
data-bind="uuid: uuid"
data-options='{"width":"100%","height":"100%", "aspectratio":"4:3", "displaytitle":"false","displaydescription":"false"}'
data-signature="@signature"
data-signature-expiration="@expiration">
</player>
和视图模型:
function ViewModel() {
var self = this;
self.uuid = ko.observable('v-1237c41f-9038-44b7-b4cc-8cb1f13f6f76')
}
ko.applyBindings(new ViewModel());
这里是fiddle to play with. In the edit box you can change the key. The key of this example is found in this url: player example.