Question

我可以使用一些建议如何处理我的角度2应用程序中的不同市场。作为一个例子，我的意思是一个新的市场（如德国市场），语言是德语。现在，我已经在html（英文为ofc）中对文本进行了硬编码，以方便自己。

您在此处看到的示例：

<div class="row">
   <h2>Booking number: {{bookingNumber}}</h2>                           
   Your changes has been confirmed.                                                
</div>

我已经阅读了有关角度2的管道的内容，我想我应该使用类似的东西。我的问题是，我真的不知道从哪里开始。已经在Visual Studio 2015中创建了一个Web Api应用程序，我可以使用并调用它。

我正在考虑在我的Web Api项目中制作两个列表（一个用于英语，一个用于德语），但仍然应该有某种指示。我的意思是：

BOOKING_NUMBER_TEXT, 'the text in english or german'
CONFIRMATION_TEXT, 'the text...'

那个列表应该有两个参数，如字符串或类似的东西..任何想法我怎么能做到这一点？

从我的角度2应用程序，我正在考虑调用api并给它一个id（数字，让我们说1和2，其中1 =英语，2 =德国）我的Web Api找到正确的列表并将其作为JSON发回。

然后我猜我自己建一个管道，我可以过滤我在html中设置的单词。我想的是：

<div class="row">
   <h2>{{BOOKING_NUMBER_TEXT | 'PIPE NAME' }}: {{bookingNumber}}</h2>                           
   {{CONFIRMATION_TEXT | 'PIPE NAME' }}.                                                
</div>

因此，当它的名称为BOOKING_NUMBER_TEXT时，它应该查看具有列表对象的管道，并取出右边的文本并将其放置。

这是一个好计划还是你可以给出任何建议？（我不想使用任何translate angular 2框架，因为我必须在每个市场上做不同的事情）

干杯：）

更新

好的..我已经创建了一些测试数据并允许它通过我的Web Api发送。这是它的外观。

public Dictionary<string, string> createEnglishLocaleKeys()
    {
        Dictionary<string, string> Locale_EN = new Dictionary<string, string>();

        // Account Component
        Locale_EN.Add("ACCOUNT_LOGIN_TEXT", "Login");
        Locale_EN.Add("ACCOUNT_LOGOUT_TEXT", "Logout");

        // Booking Component
        Locale_EN.Add("BOOKING_ACTIVE_HEADER_TEXT", "ACTIVE BOOKINGS");
        Locale_EN.Add("BOOKING_LOADING_TEXT", "Loading bookings");
        Locale_EN.Add("BOOKING_NONACTIVE_HEADER_TEXT", "NON ACTIVE BOOKINGS");
        Locale_EN.Add("BOOKING_NOPREBOOKING_TEXT", "You currently do not have any previous bookings");

        // Booking List Component
        Locale_EN.Add("BOOKING_LIST_BOOKINGNUMBER_TEXT", "Booking number");
        Locale_EN.Add("BOOKING_LIST_LEAVING_TEXT", "Leaving");
        Locale_EN.Add("BOOKING_LIST_RETURNING_TEXT", "Returning");
        Locale_EN.Add("BOOKING_LIST_ROUTE_TEXT", "Route");
        Locale_EN.Add("BOOKING_LIST_PASSENGERS_TEXT", "Passengers");
        Locale_EN.Add("BOOKING_LIST_VEHICLETYPE_TEXT", "Vehicle type");

        // Menu Component

        // Passenger Component

        // DepartureDate Component

        // Confirmation Component

        Locale_EN.Add("KEY_NOT_FOUND", "KEY NOT FOUND");

        return Locale_EN;
    }

创建了一个LocaleController，它将字符串语言环境“EN”或“DE”作为参数。然后我为控制器注入一个服务，它将根据locale字符串选择要运行的方法（现在我只发回LocaleEN字典）。

如何在我的Angular 2应用程序中创建一个值，该应用程序应该是EN作为默认值并且应该是可更改的？

通过更改，您应该能够在URL中设置它，或者某种类型，例如：

localhost:3000/amendment?locale=DE

Answer 1

这里有几件事：

您可以通过HTTP内容协商连接 - 请参阅此链接：http://restlet.com/blog/2015/12/10/understanding-http-content-negotiation/）和{{messages['SOME_KEY']}}告诉服务器返回哪些消息。
您需要等待消息显示在屏幕之前，例如：{{messages | key:'SOME_KEY'}}
如果在地图（键/值）中定义了消息，我认为您不需要实现管道来显示消息：@Pipe({name: 'key'}) export class KeyPipe implements PipeTransform { transform(value, args:string[]) : any { // Assuming the message structure is: // { key: 'SOME_KEY', value: 'some message' } return value.find((message) => { return (message.key === args[0]); }); } }
如果消息对应于列表，则可以实现和使用自定义过滤管道：Func _INetSmtpMailCom($s_SmtpServer, $s_FromName, $s_FromAddress, $s_ToAddress, $s_Subject = "", $as_Body = "", $s_AttachFiles = "", $s_CcAddress = "", $s_BccAddress = "", $s_Importance = "Normal", $s_Username = "", $s_Password = "", $IPPort = 25, $ssl = 0) Local $objEmail = ObjCreate("CDO.Message") $objEmail.From = '"' & $s_FromName & '" <' & $s_FromAddress & '>' $objEmail.To = $s_ToAddress ; was $objEmail.To Local $i_Error = 0 Local $i_Error_desciption = "" If $s_CcAddress <> "" Then $objEmail.Cc = $s_CcAddress If $s_BccAddress <> "" Then $objEmail.Bcc = $s_BccAddress $objEmail.Subject = $s_Subject If StringInStr($as_Body, "<") And StringInStr($as_Body, ">") Then $objEmail.HTMLBody = $as_Body Else $objEmail.Textbody = $as_Body & @CRLF EndIf If $s_AttachFiles <> "" Then Local $S_Files2Attach = StringSplit($s_AttachFiles, ";") For $x = 1 To $S_Files2Attach[0] $S_Files2Attach[$x] = _PathFull($S_Files2Attach[$x]) ;~ ConsoleWrite('@@ Debug : $S_Files2Attach[$x] = ' & $S_Files2Attach[$x] & @LF & '>Error code: ' & @error & @LF) ;### Debug Console If FileExists($S_Files2Attach[$x]) Then ConsoleWrite('+> File attachment added: ' & $S_Files2Attach[$x] & @LF) $objEmail.AddAttachment($S_Files2Attach[$x]) Else ConsoleWrite('!> File not found to attach: ' & $S_Files2Attach[$x] & @LF) SetError(1) Return 0 EndIf Next EndIf $objEmail.Configuration.Fields.Item("http://schemas.microsoft.com/cdo/configuration/sendusing") = 2 $objEmail.Configuration.Fields.Item("http://schemas.microsoft.com/cdo/configuration/smtpserver") = $s_SmtpServer If Number($IPPort) = 0 Then $IPPort = 25 $objEmail.Configuration.Fields.Item("http://schemas.microsoft.com/cdo/configuration/smtpserverport") = $IPPort ;Authenticated SMTP If $s_Username <> "" Then $objEmail.Configuration.Fields.Item("http://schemas.microsoft.com/cdo/configuration/smtpauthenticate") = 1 $objEmail.Configuration.Fields.Item("http://schemas.microsoft.com/cdo/configuration/sendusername") = $s_Username $objEmail.Configuration.Fields.Item("http://schemas.microsoft.com/cdo/configuration/sendpassword") = $s_Password EndIf If $ssl Then $objEmail.Configuration.Fields.Item("http://schemas.microsoft.com/cdo/configuration/smtpusessl") = True EndIf ;Update settings $objEmail.Configuration.Fields.Update ; Set Email Importance Switch $s_Importance Case "High" $objEmail.Fields.Item("urn:schemas:mailheader:Importance") = "High" Case "Normal" $objEmail.Fields.Item("urn:schemas:mailheader:Importance") = "Normal" Case "Low" $objEmail.Fields.Item("urn:schemas:mailheader:Importance") = "Low" EndSwitch $objEmail.Fields.Update ; Sent the Message $objEmail.Send If @error Then SetError(2) Return $oMyRet[1] EndIf $objEmail = "" EndFunc ;==>_INetSmtpMailCom ; Com Error Handler Func MyErrFunc() $HexNumber = Hex($oMyError.number, 8) $oMyRet[0] = $HexNumber $oMyRet[1] = StringStripWS($oMyError.description, 3) ConsoleWrite("### COM Error ! Number: " & $HexNumber & " ScriptLine: " & $oMyError.scriptline & " Description: " & $oMyRet[1] & @LF) SetError(1); something to check for when this function returns Return EndFunc ;==>MyErrFunc

此管道的实施可能是：

function mf_container($atts, $content = null) {
    $content = do_shortcode($content);
    $content = str_replace("<br />","",$content);
    $content = str_replace("<p>","",$content);
    $content = str_replace("</p>","",$content);
    return 
        "<form action='".plugin_dir_url( __FILE__ )."mult-form-submit.php' method='POST'>" . $content . "</form>";
}

add_shortcode('mult_form','mf_container');

使用Web Api处理Angular 2应用程序中的不同市场（语言/语言环境）

1 个答案: