7月 2018

Home › Archives for 7月 2018

2018/07/26

ASP.NET Core の部分ビューで JavaScript を使用したい

結論としては、HTML と JavaScript に分けて部分ビューを作成する方法に落ち着きました。   （他に良い方法があれば教えて頂きたいです。）  ## 環境  - Visual Studio 2017 - ASP.NET Core 2.1  ## 問題点  ASP.NET Core では、JavaScript は `@section scripts` の中に書くことで、`_Layout.cshtml` 内の `@RenderSection("Scripts")` の箇所に出力されます。  しかし、部分ビューの場合、`@section scripts` を書くとエラーになってしましました。   はっきりとした理由はわかりませんが、部分ビューは何度も読み込まれることを想定しているためではないかとのことです。  仕方がないので、HTML の部分と JavaScript に分けて部分ビューを作成することにしました。  尚、JavaScript だけであれば、部分ビューではなく `.js` ファイルとして作成して読み込む方法もあるかと思います。   しかし、私の場合は Razor により JavaScript のコード自体を動的に生成したかったので、JavaScript だけの部分ビューを作成しました。   （以下のサンプルコードは静的な JavaScript コードですが）  ## サンプルコード  部分ビューのファイル名はそれぞれ `Sample.cshtml` `SampleJS.html` としました。  ### 部分ビューを使用するファイル  ```html <div>@Html.PartialAsync("Sample").Result </div> @section scripts {     @Html.PartialAsync("SampleJS").Result } ```  ### 部分ビュー(HTML)   ```html <table id="sampleTable" class="table table-hover table-condensed">    <thead>        <tr>            <th>foo</th>            <th>bar</th>        </tr>    </thead>    <tbody>        <tr>            <th>foo</th>            <th>bar</th>        </tr>    </tbody></table> ```  ### 部分ビュー(JavaScript)  ```html <environment include="Development">    <script src="~/lib/datatables.net/js/jquery.dataTables.js"></script>    <script src="~/lib/datatables.net-bs/js/dataTables.bootstrap.js"></script></environment><environment exclude="Development">    <script src="~/lib/datatables.net/js/jquery.dataTables.min.js"></script>    <script src="~/lib/datatables.net-bs/js/dataTables.bootstrap.min.js"></script></environment><script>    $(function () {         $("#sampleTable").DataTable({             lengthMenu: [10, 50, 100],             displayLength: 10,         });     }); </script>```

2018/07/25

NO IMAGE

Windows の画面解像度を変更するプログラム

尚、コマンドで画面解像度を変更するフリーソフトがあるので、それを使えば簡単にできます。   実際、私は今まで nircmd というツールを使用していました。  しかし、これが最近ウイルス対策ソフト界隈でいろいろ問題になっているようで、上から使うなと言われたので、仕方なく代替案を探していました。  ただ、どうも Windows のシステムコマンド等ではできないようで、またレジストリも接続するディスプレイがわからない状態では設定のしようもないので、仕方なく Win32API を使った自作のプログラムを作成することにしました。  なんという車輪の再発明。  ## 環境  - Windows Embedded Standard 7 - Visual Studio 2017  ## サンプルコード  `ChangeDisplaySettings` という関数を使えば画面の解像度を変更できるようです。   また、現在のディスプレイの設定は `EnumDisplaySettings` で取得できるようです。  - https://msdn.microsoft.com/ja-jp/library/cc428309.aspx - https://msdn.microsoft.com/ja-jp/library/cc428506.aspx  ```cpp #include "stdio.h" #include "Windows.h"  int main(void) {     DEVMODE devMode = { 0 };          if (EnumDisplaySettings(NULL, ENUM_CURRENT_SETTINGS, &devMode) == TRUE) {              devMode.dmPelsWidth = 1920;         devMode.dmPelsHeight = 1024;         devMode.dmBitsPerPel = 32;                  if (ChangeDisplaySettings(&devMode, 0) == DISP_CHANGE_SUCCESSFUL) {             printf("success");         }     }          return 0; } ```

2018/07/24

NO IMAGE

ASP.NET Core の View で現在表示中の Controller と Action を取得する

ASP.NET Core

2018/07/20

NO IMAGE

ASP.NET Core の View 内でメソッドやヘルパーを定義する

ASP.NET Core

尚、ASP.NET MVC であった `@helper` は ASP.NET Core では削除されたようです。  ## 環境  - Visual Studio 2017 - ASP.NET Core 2.1  ## メソッドの定義する簡単な例  ### メソッドの定義  `@functions` を使用します。  ```cs @functions{     string GetString(int x)     {         if (x == 0)         {             return "foo";         }         else         {             return "bar";         }     } } ```  ### 使用方法  ```html <ul>    <li>@GetString(0)</li>    <li>@GetString(1)</li></ul>```  **結果**  ``` foo bar ```  ## ヘルパーを定義する簡単な例  ちょっとした処理なら上記で良いのですが、ヘルパーだと HTML を直に出力できるので、HTML をたくさん出力する場合にはこちらのほうが楽です。  ### ヘルパーの定義  例えば以下のように定義します。  ```cs @{     Func<int, IHtmlContent> sample1 = @<span>Sample1</span>;      Func<int, IHtmlContent> sample2 = @<text>        @if (item == 0)         {             <span>foo</span>        }         else         {             <span>bar</span>        }     </text>; } ```  `@` で始まり、`;` で終わるようです。   `@` の後はタグでなければエラーになりました。  引数へのアクセスには `@item` を使用します。   引数の数は１つにしなければならないようです。   引数をなしにしたり、２つ以上にしてデリゲートを定義するとエラーになりました。  ### 使用方法   ```html <ul>    <li>@sample1(0)</li>    <li>@sample2(0)</li>    <li>@sample2(1)</li></ul>```  **結果**  ``` Sample1 foo bar ```  ## ヘルパーの引数に DTO を使用する例  より多くの値をヘルパーに渡したい場合は DTO を定義します。  ### 定義の仕方  ```cs @using Microsoft.AspNetCore.Html @functions {     class Dto     {         public string Data { get; set; }     } } @{     Func<Dto, IHtmlContent> sample = @<span>@item.Data</span>; } ```  ### 使用方法  ```html <ul>    <li>@sample(new Dto { Data = "foo" })</li>    <li>@sample(new Dto { Data = "bar" })</li></ul>```  **結果**  ``` foo bar ```

2018/07/19

NO IMAGE

ASP.NET Core でコレクションを DI する方法

.NET Core ASP.NET Core

ASP.NET Core における DI サービス自体の説明については省略します。  ## 環境  - Visual Studio 2017 - ASP.NET Core 2.1  ## DI したいクラス  サンプルとして、ここでは以下のような `ISample` を実装した３つのクラスを DI します。  ```cs public interface ISample {     string Name { get; } }  public class Sample1 : ISample {     public string Name { get; } = "Sample1"; }  public class Sample2 : ISample {     public string Name { get; } = "Sample2"; }  public class Sample3 : ISample {     public string Name { get; } = "Sample3"; } ```  ## DI サービスへの登録  `IServiceCollection` に対してサービスの登録を行います。  ASP.NET Core MVC のテンプレートから作成した場合は、`Startup.cs` の `ConfigureServices` メソッドで行います。  方法はいろいろあるかもしれませんが、ここでは例として以下の方法を挙げます。  ### その１   同じ型 `ISample` に対して複数回登録を行います。  ```cs services.AddSingleton<ISample, Sample1>(); services.AddSingleton<ISample, Sample2>(); services.AddSingleton<ISample, Sample3>(); ```  ### その２  型として `IEnumerable<T>` を指定すると、一括で登録が行えます。  ```cs services.AddSingleton<IEnumerable<ISample>>(new List<ISample>{     new Sample1(),     new Sample2(),     new Sample3() }); ```  ## DI の仕方  コンストラクタで `IEnumerable<T>` として受け取るだけです。  ```cs public HomeController(IEnumerable<ISample> samples) {     foreach (var sample in samples)         Debug.WriteLine(sample.Name); } ```  ## DI した側で、実体を区別したい場合  別記事に書いたので、以下を参考にしてください。  - [[.NET Core] 同じインターフェイスで異なる実装を DI コンテナに登録し、区別して取り出す](https://kuttsun.blogspot.com/2019/12/net-core-di.html)

2018/07/17

NO IMAGE

Redmine の Docker イメージの Git を最新バージョンにする

Git Redmine

以下、Docker コンテナの中で作業を行います。  例えば、以下のようにして Docker コンテナに入ります。  ```sh docker exec -it redmine bash ```  - http://kuttsun.blogspot.com/2016/07/docker.html  ## Git のバージョンの確認  まずはインストールされている Git のバージョンを確認します。  ```sh # git --version git version 2.1.4 ```  現時点では、`2.1.4` がインストールされていましたが、最新は `2.18.0` です。   Git の最新バージョンは[こちら](https://git-scm.com/)で確認できます。   ## ディストリビューションの把握  Redmine の Docker イメージのベースとなっている Linux ディストリビューションを把握します。  - https://qiita.com/koara-local/items/1377ddb06796ec8c628a  `debian_version` というファイルがあったので、debian のようです。  ```sh # cat debian_version 8.10 ```  ## Git のアップデート  `apt-get` でアップデートしますが、試してもバージョンは変わりませんでした。   どうやら debian のリポジトリは古いそうなので、リポジトリを追加してアップデートを行います。  - https://qiita.com/YasuOza/items/bf867a62dd6b1c745cd6  尚、`add-apt-repository` が見つからないエラーが表示された場合、  ``` bash: add-apt-repository: command not found ```  `software-properties-common` というパッケージをインストールします。  - http://d.hatena.ne.jp/Kazuhira/20160116/1452933387  尚、先に `apt-get update` を行っていないと、`apt-file` がインストールできませんでした。  ## ソースコードからインストールする  私の場合、上記の操作を行っても、バージョンが `2.1.4` から変わりませんでした。  仕方がないので、ソースコードをビルドしてからインストールします。   方法は以下で説明されています。  - https://git-scm.com/book/ja/v1/%E4%BD%BF%E3%81%84%E5%A7%8B%E3%82%81%E3%82%8B-Git%E3%81%AE%E3%82%A4%E3%83%B3%E3%82%B9%E3%83%88%E3%83%BC%E3%83%AB  以下、細かい部分を補足します。  ### リポジトリのアップデート  まずはリポジトリのアップデートを行います。  ```sh > apt-get update ```  ### ソースコードのダウンロード  git で　git のソースコードをダウンロードします。  ```sh > git clone https://github.com/git/git.git > cd git ```  ### ビルド  公式に従って必要なライブラリをインストールします。  ```sh > apt-get install libcurl4-gnutls-dev libexpat1-dev gettext libz-dev libssl-dev ```  make がないのでインストールします。  ```sh > apt-get install make ```  公式の通りに make を実行しますが、以下のエラーが表示されました。  ``` # make prefix=/usr/local all GIT_VERSION = 2.18.0.129.ge333175     * new build flags     CC credential-store.o /bin/sh: 1: cc: not found Makefile:2261: recipe for target 'credential-store.o' failed make: *** [credential-store.o] Error 127 ```  公式とマシンが異なるので、インストールに必要なパッケージが異なっているのが原因のようです。  以下をインストールします。  ```sh > apt-get install gcc libextutils-makemaker-cpanfile-perl ```  再度 make を実行すればインストールできました。  ```sh > make prefix=/usr/local all > make prefix=/usr/local install ```  尚、一度 docker コンテナを再起動しないと、git のバージョンが最新になっていませんでした。

2018/07/09

NO IMAGE

_CRT_SECURE_NO_WARNINGS の対策

C/C++ Visual Studio

2018/07/04

NO IMAGE

GitLab Runner でクローンする URL を変更する

GitLab

2018/07/03

NO IMAGE

Razor 内で JavaScript のコードを出力する

ASP.NET Core Razor

## 環境  - Visual Studio 2017 - ASP.NET Core 2.1  ## Razor 内でのコンテンツ出力の基本  通常、Razor 内に記述されたコードは、HTML タグなどをもとにそれがコンテンツなのかどうか判別されるようです。   しかし、場合によっては自動で判別されないことがあります。  例えば、以下のコードでは、for 文の外の `test<br />` はコンテンツ部分だと正しく判別されてそのまま出力されますが、for 文内の `test<br />` の部分ではエラーとなります。  **エラーとなる例**  ```html <p>    test<br />    @for (int i = 0; i < 5; i++)     {         test<br />    } </p>```  この場合、`@:` または `<text>` で、コンテンツであることを明示する必要があります。  **正しいコード例**  ```html <p>    test<br />    @for (int i = 0; i < 5; i++)     {         @:test<br />    } </p>```  または  ```html <p>    test<br />    @for (int i = 0; i < 5; i++)     {         <text>test<br /></text>    } </p>```  **出力結果**  ```html <p>    test<br />        test<br />        test<br />        test<br />        test<br />        test<br /></p>```  `<text>` の文字は出力されません。  ## JavaScript コードの出力  以上を踏まえた上で、Razor 内で JavaScript のコードを動的に出力したい場合、以下のように記述します。  **コード例**  ```html @{     var items = new string[] { "abc", null, "def" }; }  <script>var array = [];  @foreach (var item in items) {     @:array.push('@item'); }  $(function () {     console.log(array); }); </script>```  **出力結果**  ```html <script>var array = [];      array.push('abc');     array.push('');     array.push('def');  $(function () {     console.log(array); }); </script>```  `foreach` 内で JavaScript のコードを出力する場合には `@:` (または `<text>`) が必要です。   また、その中で変数を参照したい場合は `@` を指定します。  ### 出力内容を動的に変えたい場合  個人的にこれでかなりはまりました。  例えば、上述のコードをもとに、出力を以下のように変更したい場合、`item` に対する条件判定が必要になります。   (`item` が `null` の場合は、`null` を出力したい)  **得たい出力**  ```html <script>var array = [];          array.push('abc');         array.push(null);         array.push('def');  $(function () {     console.log(array); }); </script>```  愚直に if 文を使えば以下のように書けます。  **if 文を使った例**  ```html @{     var items = new string[] { "abc", null, "def" }; }  <script>var array = [];  @foreach (var item in items) {     if(item == null) {         @:array.push(null);     }     else {         @:array.push('@item');     } }  $(function () {     console.log(array); }); </script>```  しかし、こういう Null 判定はワンライナーでシンプルに書きたいものです。   とりあえずいろいろ試行錯誤した結果、以下のように書けば目的の出力が得られました。  **三項演算子を使った例**  ```html @{     var items = new string[] { "abc", null, "def" }; }  <script>var array = [];  @foreach (var item in items) {     @:array.push(@Html.Raw(item != null ? $"'{item}'" : "null")); }  $(function () {     console.log(array); }); </script>```  思ったほどシンプルになりませんでしたが、私の頭ではこれが限界でした。   他にもっとシンプルな書き方があれば教えて頂きたいです。  上記の要点（というか悩んだ部分）は以下です。  - Razor が出力するのは文字なので、`null` も文字列として `"null"` と書けばいい - 同様に変数の中身も文字列として `$"'{item}'"` と書けばいい - しかし、単純に `$"'{item}'"` と書くと、シングルクォートがエンコードされてしまう - `Html.Raw` でエンコードを無効化する必要がある

2018/07/02

NO IMAGE

C# の Null 判定いろいろ

以下の環境で試しました。  - Visual Studio 2017 - .NET Core 2.1 - C# 7.2  ## 単純な Null 判定  例として、以下のような `string` 型の変数を例にします。  ```cs string foo; ```  愚直に if 文で判定すると、以下のような感じになります。  ```cs if (foo == null) {     Console.WriteLine("foo is null"); } else {     Console.WriteLine(foo); } ```  ### 三項演算子による Null 判定  三項演算子を使えば以下のようにかなりシンプルになります。  ```cs Console.WriteLine(foo == null ? "foo is null" : foo); ```  と、ここまでなら C 言語などでも書けますが、C# ではもっとスマートに書けます。  ### Null 合体演算子による Null 判定  Null 合体演算子 (??演算子) を使用すれば、変数名の記述が一回で済み、条件判定も不要になります。  ```cs Console.WriteLine(foo ?? "foo is null"); ```  ## Null 条件演算子  参照型のメンバーや、配列の要素などにアクセスしたい場合、愚直に Null を判定すると以下のような感じになります。  ```cs string foo = "abc";  if (foo != null) {     Console.WriteLine(foo[0]);     Console.WriteLine(foo.ToUpper()); } ```  Null 条件演算子 (`?.` `?[]`) を使うと、以下のようにシンプルに書けます。  ```cs Console.WriteLine(foo?[0]); Console.WriteLine(foo?.ToUpper()); ```  Null 合体演算子を組み合わせれば、`foo` が `null` の場合の処理も簡単に書けます。  ```cs Console.WriteLine(foo?[0].ToString() ?? "foo is null"); Console.WriteLine(foo?.ToUpper() ?? "foo is null"); ```  第１、第２オペランドの型が違う場合はコンパイルエラーになるようなので、`ToString()` で型を合わせています。    ## Null 許容型  C# では Null 許容型というのがあり、値型にも Null を代入できるようになります。  ```cs int? foo = null; ```  この場合、以下のように Null 判定ができます。  ```cs if(foo.HasValue) // if(foo != null) も可 {      Console.WriteLine(foo); // foo.Value も可 } else {     Console.WriteLine("foo is null"); } ```  これも、Null 合体演算子と Null 条件演算子を使うことで以下のように書けます。  ```cs Console.WriteLine(foo?.ToString() ?? "foo is null"); ```  第１、第２オペランドの型が違う場合はコンパイルエラーになるようなので、`ToString()` で型を合わせています。  第１、第２オペランドが同じ型であれば、以下のように書けます。  ```cs Console.WriteLine(foo ?? 0); ```

テンプレートテスト

2018/07/26

ASP.NET Core の部分ビューで JavaScript を使用したい

2018/07/25

Windows の画面解像度を変更するプログラム

2018/07/24

ASP.NET Core の View で現在表示中の Controller と Action を取得する

2018/07/20

ASP.NET Core の View 内でメソッドやヘルパーを定義する

2018/07/19

ASP.NET Core でコレクションを DI する方法

2018/07/17

Redmine の Docker イメージの Git を最新バージョンにする

2018/07/09

_CRT_SECURE_NO_WARNINGS の対策

2018/07/04

GitLab Runner でクローンする URL を変更する

2018/07/03

Razor 内で JavaScript のコードを出力する

2018/07/02

C# の Null 判定いろいろ

Translate

Popular Posts

Labels

Blog Archive